On my page, I have:
txtCalendar, an asp:TextBox used to enter a date, with an attached JQuery datepicker
btnSave, an asp:Button to save the form
btnAdd, an asp:LinkButton that opens a new form for a different part of the page.
When either button is clicked, txtCalendar_TextChanged is called before the btnSave_Click or btnAdd_Click function is called. txtCalendar_TextChanged shouldn't be called at all when these buttons are clicked - before or after.
It is possible that the JQuery datepicker is somehow causing this - when I comment out the code instantiating datepicker and binding it to the textbox, txtCalendar_TextChanged is not called.
Additionally, I have verified:
Even when I prevent the $(function() {} script from running after a postback, the txtCalendar_TextChanged method is still called when a button is clicked
I do not have any JavaScript that looks for the ID #btnSave or #btnAdd or anything that could match/respond to those IDs
the sender for txtCalendar_TextChanged is my txtCalendar textbox
eventargs for txtCalendar_TextChanged is empty (not sure if this is significant)
the text in txtCalendar doesn't actually change (verified visually in the UI, not by adding code on the backend to check)
txtCalendar_TextChanged is not called when I remove OnTextChanged='txtCalendar_TextChanged' (so - it is being called by txtCalendar, somehow...)
txtCalendar_TextChanged is called even when I remove AutoPostBack='true'
txtCalendar_TextChanged is called even when I disable the btnSave_Click function by commenting out Handles btnSave.Click (both buttons use Handles btnX.Click in the aspx.vb rather than OnClick="btnX_Click" in the aspx)
Page_Load is hit before txtCalendar_TextChanged, but the first check is If(Page.IsPostBack) Then Exit Sub - the rest of Page_Load doesn't run (so - other backend functions are not being hit)
Solved:
In vb.net, I use myDate.ToShortDateString to set the initial value in txtCalendar. ToShortDateString formats dates without leading zeroes, while datepicker's default format does have leading zeroes
When datepicker is instantiated, it changes the date format in txtCalendar, but since this is done via code, it doesn't trigger a postback. When the user clicks a button and a postback is triggered, txtCalendar_TextChanged is also triggered because of the new date format (the text string has changed).
Changing datepicker's dateFormat to m/d/yy fixed the problem.
Related
I have a repeater in UpdatePanel, and in it is a linkbutton that needs to set some values in a hidden div (display none) and then call javascript method that would make that div visible.
I am using ScriptManager.RegisterStartupScript and it is calling js method but the problem is that the code behind code is overwritten - code behind code is setting values for some fields from database (in the hidden div) and after it appears the fields are empty. If i click on a different button in repeater in updatepanel the div appears with the values set for a previous click. (the customer demand is that they click on a record in repeater and they can change it in a modal dialog).
how can i get the javascript method to make the modal dialog appear with the proper values?
current code is something like this in oncommand event for a repeater linkbutton
...
txtName.Text = row.Name;
ScriptManager.RegisterStartupScript(this, typeof(string), "showEdit", "showModalPanel('pnEdit')", true);
I recently had some issues with getting ScriptManager.RegisterStartupScript to work with partial postbacks using an UpdatePanel. Try switching your code to use something like this instead...
ScriptManager.RegisterClientScriptBlock(updPnl, updPnl.GetType(), updPnl.ClientID, "alert('hello world';", True)
You also may have to manually update your UpdatePanel on each click so that the hidden div gets the refreshed values. To do this, you'll have to set the UpdateMode on your UpdatePanel to Conditional and then be sure to go back and manually update it whenever you need to in your codebehind.
I have a table that I'm creating rows/cells in the code behind, and adding various controls to each cell. There is also as submit button on the form.
One of the cells contains an SPLinkButton. I have a Javascript function that changes the innerText/textContent based on user action from the default value set in the code behind. Prior to clicking the Button to run code behind, the end user does see the updated text of the SPLinkButton.
When the submit button is clicked, this is the only control that reverts its value back to the default value during the button's postback. A Label/TextBox/DDL all preserve their values. If I wrap the control in IsPostBack, the cell the control is added to will be null (or if I wrap the entire table, there will be no rows). Note that I'm using the value of another item to uniquely append the SPLinkButton ID on a per-table row basis.
What is different about LinkButton/SPLinkButton and postback behavior?
EDIT: I converted the SPLinkButton to a TextBox, providing similar functionality. While I dislike the presentation compared to the textbox (look and feel, as well as the SPLinkButton would automatically expand the modal size when needed), it does function. I would love to get SPLinkButton working and go back to using it, if possible.
Let me introduce the design.
Each field in a JSP is made by a Map.
The label name, the input type (drop down or other), the input values, the default values, etc are added to the Map, say Map nameAttributes.
There is another class, GeneralWriter writer, to which I do not have access, which takes the values from Map, parses them and writes the proper HTML code.
After writing the Map, writer.writeSelectBox(nameAttributes); is called.
Now, the requirement is:
There is a drop-down menu, depending upon its selected value, some other drop-down menus are disabled (shown in UI, but not modifiable) or enabled.
Since, I am not writing HTML code for the added field, I can not write the function call events to do my job.
I have observed that a JS function is called on onMouseOut event from the fields, as seen in "View Source".
So I thought I might write my code there to check the field value and impact other drop-down menus.
But if I write alert in the JS function (just to check), it won't alert me, means the function is not called and I can not write the enable/disbale code.
Is there any way to achieve the job. The enabling and disabling should depend on what user selects in one of the drop downs.
Sample code:
<%
Map nameAttr = new HashMap();
nameAttr.put(GeneralConst.INPUT_MESSAGE, Const.MSG_FIELD_NAME);
//.....
writer.writeAllSelectBox(nameAttr);
%>
Urgent help needed, thanks.
In View Source of the JSP page, its clear that for some fields onChange and onMouseOut events etc. were added, and in the GeneralWriter class, those things were being written out to the out stream as follows
out.println("<td nowrap><select name=" + strName);
out.println(" style=\"width:" + strWidth + "px\"");
out.println(" onChange ="+onChange);
So, I added my own method there rather than using existing code and introduced the onChange event. The "onChange" variable that you see (the right one) is of java.lang.String type and this had to be passed from the JSP itself, as to what behavior I want or which particular function to call for a particular JSP.
Now I added the following in JSP
<body>
<script>
window.onload = setModeForPara2('MEMBERTYPE','MEMBERSTATE','CKSTATUS') ;
function resetevent(uri){
setModeForPara2('MEMBERTYPE','MEMBERSTATE','CKSTATUS') ;
}
</script>
</body>
where the parameters are the names of the drop down menus, and setModeForPara2() is a JS function to disable/enable as my requirement was stated in original post. It checks if MEMBERTYPE is 0, then render disabled state and gray color to MEMBERSTATE and CKSTATUS drop-down menus, else enable them and remove gray color.
The resetevent(uri) is also a JS function called when the Reset button is clicked to render the disabled state to the State and Status fields.
So that way, setModeForPara2() function is called whenever:
1. the page is loaded,
2. the value of first drop-down (MEMBERTYPE) is changed, and
3. the Reset button is clicked.
Resolved.
I have a form in a modal window that is currently performing some validation.
(I am using ASP.NET MVC, JQuery UI, ajax forms, data annotations and unobtrusive is active)
When this validation triggers I have noticed so far that it does a few things:
1: my validation summary gets it's class changed from .validation-summary-valid to .validation-summary-errors
2: my invalid inputs have a class added to then called .input-validation-error
3: my validation messages get their class changed from .field-validation-valid to .field-validation-error
But there is something else that it is doing and I cant work out how it is tracking this.
I have a textbox that is required, before triggering the validation i can select inside this box, then select another box and the validation will be silent.
But as soon as i trigger the validation by clicking submit with an empty textbox, i can select the textbox and type something to remove the validation instantly, but if i then null it and select a different box this error is re-applied without re-submitting.
So my question is: what has changed, how does it know that I have attempted to submit already?
When validate is called, it adds a class to each input/select that is supposed to be validated. When the input/select is not valid it adds a class to the input/select:
class="input-validation-error"
When it is valid, it adds:
class="valid"
Validation only fires on the control when you change the value, not when it loses focus.
Validation fires on change, even before you submit the form. Take a required textbox, add a value to it, and tab off ... then go back and remove that value, and you should see the textbox highlighted red.
This should be fairly easy but I've tried a few things with no luck.
I have a series of Html.TextBoxFor fields on a page, each inside their own Ajax.BeginRouteForm. Next to each box I have a submit button, and this, when clicked, performs the Ajax update as desired.
I'd like to automate this so that when the user changes a value in a field (the onchange event) the form is submitted the same way it currently using using the submit button.
I tried using the htmlattributes to assign a JavaScript function to the onchange event (as shown below) and this causes the form to submit, but it redirects the page instead of working in the ajax fashion (as opposed to clicking the submit button which works correctly).
#(Html.TextBoxFor(model => answer.Value, new { onchange = "document.forms[" + answer.AnswerID + "].submit()" }));
(fortunately my answer.AnswerID is numeric and matches up with the numeric position of the appropriate form in the forms collection; I was referencing them by name but Razor (or something) was htmlencoding my JavaScript code...)
My only guess is that I'm breaking something by attaching code directly to the onchange event, but I'm at a loss as to the "right" way to hook into that event chain.
If you're willing to use JQuery, it's very simple to do:
http://net.tutsplus.com/tutorials/javascript-ajax/submit-a-form-without-page-refresh-using-jquery/
Calling submit() on a form will ignore any submit event handlers, as seen here. You can either
call the event handler directly, or
call click() on the submit button for the form.
The former works best if you use onsubmit and return false instead of using the event argument to the callback, because otherwise you need to pass another messy object or something.