I am using JQuery Mobile DateBox with mode timebox as timepicker. It is working perfect. What I want is that I want the timepicket input to be readonly. It should only change the time on clicking the '+' or '-' buttons. I googled much and found solutions asking to add readonly attribute and lockinput. But nothing seems to be working. Any help would be greatly appreciated. Here is the code sample of my time picker.
<input id="service_time" class="create_formobj" value="<?php echo $date ? date('h:i A', strtotime($date)) : '' ?>" type="date" data-role="datebox"
data-options='{"mode": "timebox", "overrideTimeFormat": 12}' />
I had the same problem. What did was, I made the input field of pop up readonly. It will solve your problem
The readonly function can be add like this
$('.ui-datebox-dboxin input').attr('readonly', true);
Related
I have a ruby on rails website which is designed mobile's view. In this web, I have 2 input: email and zip code which is define input[type=email] and input[type=tel] respectively. I checked this view in Safari browser and 2 above inputs work correctly - it mean the keyboard display # in email field and numeric keyboard in zip code field. I used this website (or webview exactly) to make IOS webview application, however 2 above inputs is still input[type=text] and the keyboard only display text keyboard. This is html my code:
- email field:
<input type="email" name="user_email" id="user_mail" maxlength="300" size="30" >
zip code field:
<input type="tel" name="zip_code" id="zip_code" maxlength="8" size="10" placeholder="1050001" >
What are reasons and solution of this issue? Please help me. Thank you.
For iOS webview to display numeric only, you have to have pattern="[0-9]*" at the zip code field.
<input type="tel" name="zip_code" pattern="[0-9]*" id="zip_code" maxlength="8" size="10" placeholder="1050001">
Reference: iPhone / iOS : Presenting HTML 5 Keyboard for Postal Codes
I'm using following markup to create a checkbox-based Flipswitch in jQuery Mobile 1.4.5:
<label for="flip-1">Checkbox Flip switch:</label>
<input data-role="flipswitch" name="flip-1" id="flip-1" type="checkbox">
Apparently, the same method to get the value for a select-based Flipswitch:
$("#flip-1").val()
is not working with the checkbox-based version, and i'm getting always the value of "on".
What i'm doing wrong here? Is there a way to get the value as for the select-based version?
Fiddle: http://jsfiddle.net/2ckHr/296/
Thanks in advance
Instead of reading .val() read the checked property:
alert($("#flip-1").prop("checked"));
Updated FIDDLE
I am working on JQuery Mobile Datebox and there is something i can't fix. If user type some weird input in year area something like 1988123, datebox gets crazy and changes value of date "undefined, undefined NaN, NaN".
I tried the get only year value from Datebox, but day, month or year area doesn't have id field. So I couldn't get any solution. Can anybody help me?
try HTML5 pattern:
<form
onsubmit="alert('Submitted.');return false;">
<input
type="text"
required=""
pattern="(?:19|20)[0-9]{2}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-9])|(?:(?!02)(?:0[1-9]|1[0-2])-(?:30))|(?:(?:0[13578]|1[02])-31))"
value=""
name="dates_pattern2"
id="dates_pattern2"
list="dates_pattern2_datalist"
placeholder="Try it out.">
<input
type="submit"
value="ยป">
<datalist
id="dates_pattern2_datalist"></datalist>
</form>
Finally I did find a solution.
As you know, JQuery Mobile Datebox has some data-options. I find an option which is "maxYear".
<input name="tarih1" id="tarih1" type="date" data-role="datebox" data-options='{"mode": "datebox", "maxYear":"3000"}' placeholder="GG.AA.YYYY">
With this solution, user can't choose a year which has more than 4 digit. (You can change 3000 to another 4 digit year. Bu don't forget, if you choose for example 1999, user can't choose greater than 1999)
How can I close a browser page via eg. an HTML button and Dart?
I've tried
window.close();
which doesn't appear to do anything;
I've also tried :
window.document.$dom_dispatchEvent();
using CloseEvent, but I'm not sure how to set that up.
I've also tried HTML and javascript without success.
Please advise how this can be done. It's needed for desktop-type apps IMO.
I used this:
<form method="post">
<input type="button" value="Close Window"
onclick="window.close()">
</form>
Maybe try
window.focus(); window.close()
I installed calendar Version 1.2.0-SNAPSHOT in grails and working good .
But facing one Issue :
When click on cancel button i was doing form reset .but the calendar field is becoming clear and not reseting to default date .
<g:form url="${response}" id="program" name="program" method="post">
<calendar:datePicker name="startDate" id="startDate" defaultValue="${program.startDate}" dateFormat="%Y-%m-%d"/>
<input type="button" id="cancel" name="cancel" value="Cancel" onclick = 'reset_form(this)' />
</g:form>
function reset_form(this_)
{
document.getElementById('program').reset();
}
any one have idea please ?
thanks.
Two ways to solve this issue as far as I can see. Either correct the typo inside your JavaScript and refer to the correct id of your form (program not new_program) or use the standard reset button for forms <input type="reset" .../> instead of your javascript solution.