I can't seem to get my textbox to automatically postback after selecting a date from the bootstrap datetimepicker (Downloaded from here). I stil have to press enter for the event to trigger.
<div class="span3">Date<br />
<div id="datepicker" class="input-append date">
<asp:TextBox ID="txtDate" runat="server" OnTextChanged="txtDate_TextChanged" AutoPostBack="true" />
<span class="add-on">
<i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
</span>
</div>
</div>
When you select a datetime the input control not lose focus, so the postback not occur. You can force a postback in the event triggered from the datepicker like (not tested):
el.on('changeDate', function(e) {
__doPostBack('<%= txtDate.ClientId %>','');
});
where el is the element on you bind the datetime picker.
Alternatively you can force a blur like:
el.on('changeDate', function(e) {
$('<%= txtDate.ClientId %>').blur();
});
Ref: http://tarruda.github.io/bootstrap-datetimepicker/
Related
I have a jquery mobile panel like so:
<a href="#panel2" class="ss-header-actions-language">
<span class="ss-header-labels" id="ss-general-label">Language</span>
</a>
<div data-role = "panel" id = "panel2" data-display="overlay" data-position="right" data-swipe-close="false" >
<asp:RadioButton ID="rdbEng1" AutoPostBack="true" runat="server" Text="English" GroupName="lang" />
<asp:RadioButton ID="rdbspan1" AutoPostBack="true" runat="server" Text="Español" GroupName="lang" />
<asp:Button runat="server" Text="Submit" OnClick="Submit_Click" />
</div>
I want the panel to close when the submit button is clicked. Right now, panel closes when I select any radio button inside the panel. I want the panel to stay open if the Radio button is clicked, but as soon as I click on submit button, I want the panel to close.
How can I achieve that. Any help will be highly appreciated.
First you need to prevent postback to server, in order to do that set AutoPostBack="false" to RadioButton and you can change asp:Button to input.
Then according to JQuery Mobile Panel:
A panel can also be closed by calling the panel's close method
directly.
So this should work:
<a href="#panel2" class="ss-header-actions-language">
<span class="ss-header-labels" id="ss-general-label">Language</span>
</a>
<div data-role="panel" id="panel2" data-display="overlay" data-position="right" data-swipe-close="false">
<asp:RadioButton ID="rdbEng1" AutoPostBack="false" runat="server" Text="English" GroupName="lang" />
<asp:RadioButton ID="rdbspan1" AutoPostBack="false" runat="server" Text="Español" GroupName="lang" />
<input type="button" onclick="ClosePanel();" name="Submit" value="Submit" />
</div>
<script type="text/javascript">
function ClosePanel() {
$("#panel2").panel("close");
}
</script>
I am using bootstrap datetimepicker (http://eonasdan.github.io/bootstrap-datetimepicker/Installing/).
When I select the date the picker does not hides and I have to click outside to close it.
How to close datetimepicker when date is selected/clicked?
<div class="col-sm-3">
<asp:TextBox ID="date2" class="form-control" runat="server"
onfocus="this.style.backgroundColor='yellow'"
onblur="this.style.backgroundColor='cyan'"/>
<script type="text/javascript">
$(function () {
$('#date2').datetimepicker();
});
</script>
</div>
You can force the datetimepicker to hide itself with the following piece of code.
$('#date2').data("DateTimePicker").hide();
For other functions like hide please consider checking out the documentation.
I need a calendar to be displayed on a textbox.
This can be achieved using ajaxToolkit: Calendar control.
I can use FilteredTextBoxExtender to ensure that it enters only valid characters.
Also I can use jQuery to ensure that the dates are valid dates only (13/13/20123 is an invalid date).
But is there a better way or ajax control (in the toolkit) for it?
Note: I am looking for a solution using ajax control toolkit. For my project, jQuery-UI is not allowed.
<ajaxToolkit:Calendar runat="server"
TargetControlID="Date1"
CssClass="ClassName"
Format="MMMM d, yyyy"
PopupButtonID="Image1" />
<ajaxToolkit:FilteredTextBoxExtender ID="ftbe" runat="server"
TargetControlID="txtDate"
FilterType="Custom, Numbers"
ValidChars="1234567890/" />
REFERENCE:
http://forums.asp.net/p/1825929/5076051.aspx/1?Re+How+to+disable+future+dates+in+ajax+calendar+extender+
Try Using jQuery UI Datepicker:
<script>
$(function() {
$( "#datepicker" ).datepicker();
});
</script>
<div class="demo">
<p>Date: <input id="datepicker" type="text"></p>
</div>
jQuery UI Datepicker
i have following problem, i am using a popup jquery dialog with asp:formview .
the purpose of this popup is for user to enter a hyperlink which is placed then in textbox control in formview
the popup dialog div is located outside a formview just after body tag
<body style="background-color: #FFFFFF; font-family:Lucida Console;">
<div id="dialog-form" title="sdfdfsdf" style="font-size:14px; ">
<form>
<fieldset>
<label for="link">sdfdf</label>
<input type="text" name="sdfsdf" id="link" size="32" />
</fieldset>
</form>
</div>
<form id="form1" runat="server" style="margin-top:50px;" >
<div>
<asp:FormView ID="FormView1"
.......
<InsertItemTemplate>
...
<sometextbox ...../>
<button id="create-user" class="ui-state-default ui-corner-all">Create link</button>
...
</InsertItemTemplate>
After clicking a button a popup window is shown BUT the page starts to refresh immediately
and of course the popup is then hidden.
If I relocate the button outside the formview - the page is not refreshed, but i need it in formview..
Any idea what to do?
add the following attribute to the button:
onclick="javascript: return false;"
this behavior should not come out because it is a button not submit button.
it seems when it is inside the form view a submit action is attached to it, check your jQuery scripts maybe you mistakenly added onclick submit while attaching the dialog.
I found my answer:
clientId must be used:
FTB_API['<%=FormView1.FindControl("AdminCommentTextBox").ClientID%>'].SetHtml(...)
Um, I have this guy:
<div class="buttonRight"><asp:Button ID="btnOK" runat="server" Text="OK" Width="68px"/></div>
which renders out to
<div class="buttonRight">
<input type="submit" name="_$_$pc$pc$tabTO$_$uc0$popupSelectCompetition$btnOK" value="OK" id="____pc_pc_tabTO___uc0_popupSelectCompetition_btnOK" style="width:68px;" /></div>
I need to call some javascript on that button without altering its behavior otherwise. I tried putting an OnClick asp attribute but that seems to be for postbacks to call server code, not passing through a javascript hook to the rendered html.
I also don't understand how the input being type='submit' affects me.
Add your client-side code to the OnClientClick property :
<div class="buttonRight">
<asp:Button ID="btnOK" runat="server" Text="OK" Width="68px"
OnClientClick="alert('client side scripts here');"/>
</div>
OnClick property used for server side events.
Or add onclick attribute to your control like that at code behind :
btnOK.Attributes.Add("onclick", "alert('client side scripts here');");