I am working on .net 2.0 I am populating a Grid View with multiple textboxes. The textbox has text change event. There is also a button with click event. The problem I am facing is that when the I enter the text in textbox and then click on button, the text change event gets fired, and the execution does not come to button click block. How can I detect if button has been clicked when both the events are fired.
There is the textbox with call to function for text change event
<asp:TextBox ID="txtChassis" runat="server" CssClass="form_text_box" AutoPostBack="true" OnTextChanged="Chassis_TextChanged"></asp:TextBox>
and also call to function for button click event.
<input class="form_button" id="btnSearch" title="Show Details" accesskey="S" type="submit"
value="SAVE" name="btnSave" runat="server" onserverclick="btnSearch_ServerClick"/>
However, in case text is placed in textbox and button is clicked, then the text change event function gets called.
Your Problem is, that events in ASP are only raised after a PostBack.
The Post back happens if the Button is pressend, and the Client Posts Back (therfor the Name) his Data of the Fields.
After this PostBack the Server (your application) calls all events that happend during the last Page_Load.
As far as i know, there is no real order in which the events are thrown, but the textChanged event should be thrown anyway.
If you want to hand your textChanged event directly after the Text hast changed you have to use "AutoPostBack" as Myat Thu already mentioned. Be aware that this increases your traffic signifficant, and can also change the flow of your code!
I suggest designen the events indipendet so the user can hit the "PostBack Button" and all events are called at one post back. This saves traffic and load on the server.
But this is just my personal oppinion.
Are you writing code for a window application or a web application? If you're writing for a web application, there are properties for TextBoxes which are:
CaseValidation
AutoPostBack
You should try out both of these properties for your TextBox object.
Related
I have an Angular JS app with a bootstrap ui modal dialogue hosting a simple edit form.
The form can be for a new "thing" or a populated "thing".
I find that when I cancel out of the modal with the form populated, submit is being called.
Any help appreciated.
Plunkr here... http://plnkr.co/edit/XhQCqlGUfcmQOhqLDeXR?p=preview
I forked your plunk and got it working here: http://plnkr.co/edit/jgg5pDQOH46XgrbW3Mvh?p=preview I think the cancel button was participating in the form submit event since it was inside the form element. Moving it outside of the form seems to have fixed the problem. I also set up the submit event to fire the modalInstance close event and the cancel event to fire the modalInstance dismiss event. This gives you the opportunity to handle things appropriately in the parent controller (ModalDemoCtrl).
EDIT
You could also stop the click event from propagating in the cancel event and still use the save as an input element inside the form tag. See this plunk for example: http://plnkr.co/edit/A81KkUUQEL3IBbOSnHQb?p=preview
I was having a similar problem. My problem was that when I clicked in the button to open the modal, my form was submited. I was using a "button" html tag, without specifying the "type" attribute. So, I found your problem and I went to the W3C documentation. I found that:
Tip: Always specify the type attribute for a button element. Different browsers use different default types for the button element. (http://www.w3schools.com/tags/tag_button.asp)
I wasn't defining the type of my button, so the default type of my browser was submit. I defined the type to "button" and everything is ok now.
I want to remove the CalculateCost event when it meets a certain criteria. There isn't any room for design changes, this is what I have to work with: layout, is an aspx page with a jquery tab (each tab is a .net user control). The tabs are added dynamically. Within this user control the follow input element exist and the method bound to the onchange event is the target.
<input type="text" id="txtCost" disabled="disabled" onkeypress="return isValidMoney(event);" onchange="CalculateCost(true, false); ValidateCostPerUOM(this);" runat="server"/>
What is happening: when this field is being edited and doesn't lose focus the event is not fired. The user doesn't trigger the blur and selects a different tab. the onchange event is fired by (jQuery or .net) but during the function execution the selected tab value changes hosing things up.
What I'd like to do in the jQuery tab's select method is check for this method in the execution queue and remove (or stop it). I have no code samples because I have no clue where to start. I tried looking at the jQuery.queue() api doc but was fruitless.
Thanks!!!
I'm creating a jQuery mobile form that will display a calculated answer in a div below the form. Basically, a client-side submit button However, i'm not really having luck trying to fire the event. But it seems to be reloading the page or DOM, I don't really know and adds the values from the selected items before the submit button was hit. It seemed like the form is being posted, when this form wasn't supposed to post anything. This form is taking values from the JSON file and add them as options, radio buttons and checkboxes. The code below does not seem to fire at all when the submit button is clicked:
$("form").submit(function(event){
alert("submit button clicked");
event.preventDefault(); // stop default behaviour of submit
event.stopPropagation(); //event handler moved to something else
calculate(); //invokes the calculate method
}
I'm not really sure on what attributes my form would need since this would be a client-side submit button. I only had the id and wrapped all the jQuery mobile controls inside the form.
The full site that I'm trying to get the submit event to work properly is here: http://goo.gl/C9tW7
UPDATE: Looks like I was missing the pound sign on the declaration of the event handler. It looks like this particular issue is resolved though. The submit button event handler is properly firing, but the calculations that needed to be displayed isn't executing the way it should.
from your code, you are missing ending parenthesis
$("form").submit(function(event){
alert("submit button clicked");
event.preventDefault(); // stop default behaviour of submit
event.stopPropagation(); //event handler moved to something else
calculate(); //invokes the calculate method
}); //<-- here
make sure your button's markup looks as below
<button data-theme="b" id="submit" type="submit">Submit</button>
and hoep you set your form id correctly
Is there a reason why the click handler is removed from my button after calling the button() method on it. I am changing the content of my buttons, and as a result I need to refresh them. I noticed refresh does not work, so I tried the button method.
This will restyle my "button", but I lose my click event.
How can I accomplish both?
http://jsfiddle.net/RQZG8/2/
And here is the code:
$("[data-role=button]").html("hello world").button();
$("[data-role=button]").click(function(){
alert("i have been clicked");
});
My big issue is that I have a div which is acting as a button. I want to change the content of the div, but I want to be able to have it continue to look like a button while keeping it's behavior.
Try this: $("[data-role=button] .ui-btn-text").html("hello world"); otherwise the padding is lost.
First of all IMHO, given your example that goes with the question (when you change only caption of a button), there is no much point to use a div as a button when jQM gives you a lot of standard choices.
All of these:
<button>Button element</button>
<input type="button" value="Button" />
<input type="submit" value="Submit Button" />
will be automatically enhanced by jQM to buttons without even specifying data-role="button".
And you can of course use a link as a button
Link button
Now if you still want to use your div as a button you don't need to specify data-role="button" just call button() plugin. That will create all necessary markup for you and your original div will be preserved as hidden.
<div id="button1">By button<div>
$("div#button1").button();
To refresh a button after you changed its caption you need to call refresh method:
$("div#button1").html("Hello World").button("refresh");
Now to normally handle the click event of a particular button (if it's not the only one on the page) you probably need more specific selector than just the data-role=button attribute. id would be perfect for that. So instead of
$("[data-role=button]").click(function(){...});
do
$("div#button1").click(function(){...});
And lastly you most certainly know that, but I didn't see it in your jsfiddle, so I just mention that you better put your code in one of the jQM page handlers. pageinit is recommended way to go.
$(document).on("pageinit", "#page1", function(){
...
});
Here is jsFiddle.
I am currently working on a Customer Management application made in SmartGWT 2.0.
The Add Customer form is a fairly big one with multiple tabs and each tab has lot of fields. This form is opened in a modal window which have a save and a close button at the bottom.
Since this is a huge form, sometimes the rep accidentally hits Close without noticing that there is some information in one of the tabs.
We want to add some kind of alert when user tries to close the form after he has made changes to it.
I saw that there is ChangeHandler on text items which can flag a change which can be evaluated before firing the close event. However currently doing this for so many fields is a little bit cumbersome. Is there a way of achieving this on a DynamicForm level or even better on the Window level?
I am looking for a SmartGWT equivalent of this jquery code:
$("input:text, select, input:checkbox, input:radio, input:password").change(function(){
unloadRoutineFlag = true;
});
Take a closer look at this handler at the dynamicForm level.
addItemChangedHandler(ItemChangedHandler handler)
Handler fired when there is a changed() event fired on a FormItem
within this form.
Typically, when a formItem fires the changed() event, the form gets notified. Let us know if this works.