html - Preview not displaying any letters while typing in search box -
in jsfiddle.net it's working not when previewing app worklight console: http://jsfiddle.net/sphakrrokr/k4l6ej9z/6/
before, when simple html written working position not side side search box , go buttton
<input type="search" name="search" id="search" data-mini="true" placeholder="search restaurants" data-theme="a" data-inline="true"> <input type="submit" value="go" data-inline="true" id ="submit" onclick="getrestaurants()">
after changes positioning side side, afterwards text not displayed when typing...
<head> <style type="text/css"> #the-page {float:center;width:100%} #submit_con {width:20%; float:left;} #search_con {width:80%; float:left;} #search {width:100%;} #submit {width:100%;} </style> </head> <body> <div data-role="header" id="the-page" data-position="fixed"> <h3>yummy</h3> <div data-role="navbar" id="navbar" data-iconpos="left"> <ul> <li><a href="#favs" id="favs" data-icon="star">favs</a></li> <li><a href="#mypanel" id="more" data-icon="bars">more</a></li><!-- panel link --> </ul> </div> <label for="search" id="label" style="font-weight: bold; font-style: italic; font-family: comic sans ms"></label> <div id ="search_con"> <input type="search" name="search" id="search" data-mini="true" placeholder="search restaurants" data-theme="a"> </div> <div id="submit_con"> <input type="submit" value="go" data-inline="true" id ="submit" onclick="getrestaurants()"> </div>
you've provided incomplete html...
anyway, missing div, nothing make textfield inoperable. said, it's working fine regardless.
i've copied html new project+application (created jquery mobile wizard in mfp studio) followed run > run on mobilefirst development server. when previewing common web resources mfp console , trying type in text field - it's working:
common\index.html:
<!doctype html> <html> <head> <meta charset="utf-8"> <title>test</title> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0"> <!-- <link rel="shortcut icon" href="images/favicon.png"> <link rel="apple-touch-icon" href="images/apple-touch-icon.png"> --> <link rel="stylesheet" href="css/main.css"> <script>window.$ = window.jquery = wljq;</script> </head> <body style="display: none;"> <div data-role="header" id="the-page" data-position="fixed"> <h3>yummy</h3> <div data-role="navbar" id="navbar" data-iconpos="left"> <ul> <li><a href="#favs" id="favs" data-icon="star">favs</a></li> <li><a href="#mypanel" id="more" data-icon="bars">more</a></li><!-- panel link --> </ul> </div> <label for="search" id="label" style="font-weight: bold; font-style: italic; font-family: comic sans ms"></label> <div id ="search_con"> <input type="search" name="search" id="search" data-mini="true" placeholder="search restaurants" data-theme="a"> </div> <div id="submit_con"> <input type="submit" value="go" data-inline="true" id ="submit" onclick="getrestaurants()"> </div> </div> <script src="js/initoptions.js"></script> <script src="js/main.js"></script> <script src="js/messages.js"></script> </body> </html>
common\css\main.css
#the-page {float:center;width:100%} #submit_con {width:20%; float:left;} #search_con {width:80%; float:left;} #search {width:100%;} #submit {width:100%;}
Comments
Post a Comment