My ASP page has a DropDownList (DDL) and a bunch of checkboxes. When my user selects a DDL item, I have some JS/jQuery code to make several checkboxes invisible according to some logic. However, the postback of the DDL, needed to run the C# code-behind event handler, causes a redraw of the entire page and makes all checkboxes visible.
How can I prevent the postback from wiping out the actions of the JS? Should I store visibility bits in something like ViewState?
Is it possible to have the JS code run AFTER the postback, instead of before?
Is it possible/easy to use CallBack instead of PostBack for the ASP DropDownList? I was thinking that the fun of Ajax was avoiding postbacks and only updating the control instead of the entire page.
Well if the dropdown posts back in the same action that you flip the switch for the checkboxes, why not then put the logic to show/hide checkboxes on the server instead of the client? You can use the hidden field approach, and that would work fine.
The callback means the UI needs updated by JavaScript. I don't know what all the postback updates, but you would have to send everything up via JSON, and refresh the UI via JavaScript. So only you can make that call.
Related
I am using an AJAX ComboBox in my ASP.Net web application and I have an OnItemInserted event that requires a postback to hit the server side logic however this requires that I have AutoPostBack = True. This causes an unwanted effect of OnSelectedIndexChanged event triggering a Postback causing the control to lose focus.
More background: This combobox resides inside of a fairly complex gridview which contains other comboboxes, dropdownlists, and textboxes. My objective is to allow the user to smoothly tab through the row while entering data without having to use the mouse to promote rapid data entry.
I believe that I need to utilize javascript to suppress this postback but I am open to suggestions.
You can suppress the postback by simply returning false on the relevant client event:
http://edgewaters.blogspot.com/2008/01/button-that-doesnt-post-back.html
OnSelectedIndexChanged="return false"
I'm doing some ASP using Telerik.
On my page there are 2 buttons called Create Window and Postback. The Create Window button created a new RadWindow dynamically on it's click event (client-side) by using window.radopen(). The Postback button simply does a postback. My problem is that, the windows get lost after every postback. What can I do to make my RadWindows to remain opened after a postback, including its content and position.
If there is no built-in function to restore my dynamic RadWindows, please tell me how to save current windows content to manually load it on the next postback. I thought of using a Hidden control to save my RadWindow position and content, but how can I do that (it's content is a user control with plentiful textboxes, and i don't want my customer to re-type all the textboxes).
The RadWindows are generated via JavaScript when they are first shown. You can easily check this via your developer plugin of choice. Once you show them they create their wrapper div as a direct child of the form element. This means that they have no server-side rendering and thus cannot be persisted on the server across postbacks.
What you can do is use AJAX - have the button perform an AJAX request that will update the needed content of the page, but will leave the RadWindows out of the update. Check out this help article where they explain how to use AJAX with a RadWindow: http://www.telerik.com/help/aspnet-ajax/radwindow-ajaxifying.html.
I converted a 100% ASP.NET driven form to using nearly all AJAX based architecture except that it doesn't submit the data using AJAX call, yet. It does a full page postback. And because the button submissions are still tied to so much functionality (it's a global button custom control with multiple buttons), I chose not to convert them over to AJAX yet.
Every piece of data submits fine, except for one use-case. It's a dropdown that is dependent from another dropdown. So now, when the value of dropdown 1 changes by the end user, dropdown 2 gets rebuilt from AJAX calls (JavaScript). Note, dropdown 1's options NEVER change in the life of the application. When the form is submitted after that workflow, we lose the value of dropdown 2. Hopefully this is making sense. If dropdown 1 doesn't change, dropdown 2 still has the same options from when the form was built in the code behind, so the value in the viewstate can be found when it's posted.
Right now, I have a hidden field to keep track of that value that was selected and works fine for now, but is a bit clumsy. Before I did this development, both dropdowns had the AutoPostback attribute turned on. That caused the form to get resubmitted without submitting the form, just so the dropdowns could get rebuilt.
Is there a better approach to this problem without making the button perform an AJAX call to submit the data?
Values manipulated in JavaScript can't be maintained on postback, because it won't be accessible on the server side. You can put the selected Value in the Hidden Field and then get it from the Hidden Field.
I have stumbled upon the issue when I need to retract html controls I've added client-side using JavaScript after the postback (due to server-side validation - this is not optional).
Please tell me if the way I'm trying to achieve this is cr*p and there's a better way of doing this.
basically, what I'm doing is cloning a textbox control for up to 10 times on the page when the user hits "Add" and storing entered values from each of those texboxes in a hidden field to read from in the code behind. This works fine, however, when the server side validation doesn't pass after postback, all those dynamically added (cloned) texboxes disappear, since ViewState knows nothing about them.
I am considering 2 possible solution, both of which seem hacky:
Rebuild all cloned textboxes on document onload() using stored values in the hidden field
wrap the form in ajax update panel and place the cloned texboxes outside of it, thus, not refreshing this part of the screen on postback
now, is it possible to somehow "update" ViewState to make it aware of all the html controls I've added using client-side script? Any better ideas? I'd like to achieve this with client-side script, therefore not considering cloning textboxes on server-side, sorry.
You cannot modify the ViewState on the client side. If you do, you will invalidate the viewstate and receive an error on the postback.
In your case you might want to consider using javascript and jQuery to render the text boxes on the document ready event with the values stored in your hidden field. I'd recommend taking a look at jQuery templating, particularly if you can store your data as JSON in the hidden field (http://weblogs.asp.net/scottgu/archive/2010/10/04/jquery-templates-data-link-and-globalization-accepted-as-official-jquery-plugins.aspx).
I am submitting a page onclick of a form element and need a function to run after the submit refreshes the page. I'm trying to add an animated scroll back to the clicked element that caused the submission. I've got the scroll part covered but I can seem to figure out how to cause the function I wrote for the scroll to run after the page refreshes from the submit.
Any timely help would be much appreciated!
If you are doing a full submit, rather than an AJAX submit, then the page that displays afterwards is not the same page as the one that the form was submitted from. Consequently, the identity of the clicked element will not be available on the second page.
What you need to do is, during the submit handler, store the identity of the clicked element (Should probably be a unique ID of some kind) in a hidden field of the form.
When the page refreshes, it should now have the unique ID available (Probably placed in the same hidden field of the form by the server side code) and a javascript function can read this value to control the scrolling.
Does this make sense?
If you update your question to include some sample code, then I might be able to clarify further.
If you do a "real" form submit, where the actual page refreshes, there is no way you can do it from the client (except using frames). Once you leave the page, your javascript is out of scope. You need to insert the javascript to the refreshed page on the server.
If, on the other hand, you are submitting the form and refreshing a part of the page via ajax, then, depending on the framework you use, you'll be looking for a callback hook like onSuccess etc. in your ajax submit function
This would be easier to do in ajax however if you need to do it as a postback then you need to attach an event to the body load event and send some data back with the postback that would identify that the page has loaded as part of a post back and not a new page load.
e.g. create a hidden contol ont he web page and on the postback give it a value , on the postback check to see if that hidden control has a value and if so run your scorll code.