ASP NET postback with JavaScript

Question

I have several small divs which are utilizing jQuery draggable  These divs are placed in an UpdatePanel  and on dragstop I use the  doPostBack   JavaScript function  where I extract necessary information from the page s form  My problem is that when I call this function  the whole page is re-loaded  but I only want the update panel to be re-loaded

User · Answer

Have you tried passing the Update panel s client id to the   doPostBack function   My team has done this to refresh an update panel and as far as I know it worked     doPostBack UpdatePanelClientID     Some String

User · Answer

First  don t use update panels   They are the second most evil thing that Microsoft has ever created for the web developer   Second  if you must use update panels  try setting the UpdateMode property to Conditional   Then add a trigger to an Asp Hidden control that you add to the page   Assign the change event as the trigger   In your dragstop event  change the value of the hidden control   This is untested  but the theory seems sound     If this does not work  you could try the same thing with an asp button  just set the display none style on it and use the click event instead of the change event

User · Answer

You can t call  doPostBack   because it forces submition of the form  Why don t you disable the PostBack on the UpdatePanel

User · Answer

If anyone s having trouble with this  as I was   you can get the postback code for a button by adding the UseSubmitBehavior  false  attribute to it  If you examine the rendered source of the button  you ll see the exact javascript you need to execute  In my case it was using the name of the button rather than the id

User · Answer

Using   doPostBack directly is sooooo the 2000s  Anybody coding WebForms in 2018 uses GetPostBackEventReference   More seriously though  adding this as an answer for completeness  Using the   doPostBack directly is bad practice  single underscore prefix typically indicates a private member and double indicates a more universal private member   though it probably won t change or become obsolete at this point  We have a fully supported mechanism in ClientScriptManager GetPostBackEventReference    Assuming your btnRefresh is inside our UpdatePanel and causes a postback  you can use GetPostBackEventReference like this  inspiration    function RefreshGrid          lt    ClientScript GetPostBackEventReference btnRefresh  String Empty    gt

User · Answer

Here is a complete solution  Entire form tag of the asp net page   lt form id  form1  runat  server  gt       lt asp LinkButton ID  LinkButton1  runat  server    gt   lt  -- included to force   doPostBack javascript function to be rendered --  gt        lt input type  button  id  Button45  name  Button45  onclick  javascript   doPostBack  ButtonA       value  clicking this will run ButtonA Click Event Handler    gt  lt br   gt  lt br   gt       lt input type  button  id  Button46  name  Button46  onclick  javascript   doPostBack  ButtonB       value  clicking this will run ButtonB Click Event Handler    gt  lt br   gt  lt br   gt        lt asp Button runat  server  ID  ButtonA  ClientIDMode  Static  Text  ButtonA    gt  lt br   gt  lt br   gt       lt asp Button runat  server  ID  ButtonB  ClientIDMode  Static  Text  ButtonB    gt   lt  form gt    Entire Contents of the Page s Code-Behind Class  Private Sub ButtonA Click sender As Object  e As System EventArgs  Handles ButtonA Click     Response Write  You ran the ButtonA click event   End Sub  Private Sub ButtonB Click sender As Object  e As System EventArgs  Handles ButtonB Click     Response Write  You ran the ButtonB click event   End Sub    The LinkButton is included to ensure that the   doPostBack javascript function is rendered to the client  Simply having Button controls will not cause this   doPostBack function to be rendered  This function will be rendered by virtue of having a variety of controls on most ASP NET pages  so an empty link button is typically not needed   What s going on   Two input controls are rendered to the client    lt input type  hidden  name    EVENTTARGET  id    EVENTTARGET  value      gt   lt input type  hidden  name    EVENTARGUMENT  id    EVENTARGUMENT  value      gt       EVENTTARGET receives argument 1 of   doPostBack   EVENTARGUMENT receives argument 2 of   doPostBack   The   doPostBack function is rendered out like this   function   doPostBack eventTarget  eventArgument        if   theForm onsubmit     theForm onsubmit      false             theForm   EVENTTARGET value   eventTarget          theForm   EVENTARGUMENT value   eventArgument          theForm submit               As you can see  it assigns the values to the hidden inputs    When the form submits   postback occurs    If you provided the UniqueID of the Server-Control Button whose button-click-handler you want to run  javascript   doPostBack  ButtonB       then the button click handler for that button will be run    What if I don t want to run a click handler  but want to do something else instead   You can pass whatever you want as arguments to   doPostBack  You can then analyze the hidden input values and run specific code accordingly   If Request Form    EVENTTARGET      DoSomethingElse  Then     Response Write  Do Something else    End If   Other Notes   What if I don t know the ID of the control whose click handler I want to run   If it is not acceptable to set ClientIDMode  Static   then you can do something like this    doPostBack   lt    myclientid UniqueID   gt          Or    doPostBack   lt    MYBUTTON UniqueID   gt       This will inject the unique id of the control into the javascript  should you wish it

User · Answer

While Phairoh s solution seems theoretically sound  I have also found another solution to this problem  By passing the UpdatePanels id as a paramater  event target  for the doPostBack function the update panel will post back but not the entire page     doPostBack  myUpdatePanelId         note  second parameter is for addition event args  hope this helps someone    EDIT  so it seems this same piece of advice was given above as i was typing

User · Answer

Per Phairoh   Use this in the Page Component just in case the panel name changes   lt script type  text javascript  gt        lt  --        must be global to be called by ExternalInterface          function JSFunction                    doPostBack   lt    myUpdatePanel ClientID    gt                         -- gt        lt  script gt

[javascript] ASP.NET postback with JavaScript

Examples related to javascript

Examples related to asp.net

Examples related to webforms

Examples related to updatepanel

Examples related to postback