asked on

execute code behind before javascript function

I have a button within a listview that I set an onclick attribute to execute a javascript function. This button also has a command argument that executes in code behind.
Both work, but it currently executes the javascript before the code behind. I need to execute the code behind before the javascript.
How would I do this?
Thankis

### button in listview

<span onclick="return confirm('Create/Edit Service from this Schedule?')">
<asp:Button ID="LnkCreateService" runat="server" CommandArgument='<%# Eval("ServicesLU.LUServiceID")%>'           CommandName="CreateService" ForeColor="Navy" Text="Create/Edit Service" />
</span>

### attribute added during itemdatabound

   Protected Sub lstSchedules_ItemDataBound(ByVal sender As Object, ByVal e As ListViewItemEventArgs)
      Dim Schedule As Label
      Dim isComplete As HiddenField
      Dim img As Image
      If e.Item.ItemType = ListViewItemType.DataItem Then
         ' Display the e-mail address in italics.
         Dim buttCreate As Button = DirectCast(e.Item.FindControl("LnkCreateService"), Button)
         If Not buttCreate Is Nothing Then
            buttCreate.Attributes.Add("onclick", "javascript:clickcreateschedule(1)")
         End If
         Schedule = DirectCast(e.Item.FindControl("lblSched"), Label)
         isComplete = DirectCast(e.Item.FindControl("isComplete"), HiddenField)
         img = DirectCast(e.Item.FindControl("img"), Image)
         If isComplete.Value = "True" Then
            img.Visible = True
            ' Schedule.Text = Server.HtmlDecode(Schedule.Text + "<img src ='~/images2020/checkmark_32.png'  alt='Yes' />")
         Else
            img.Visible = False
         End If
      End If
   End Sub


### Code behind needs to execute first

   Protected Sub CreateService(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.ListViewCommandEventArgs)
      Dim dataItem As ListViewDataItem = CType(e.Item, ListViewDataItem)
      Dim item As ListViewItem = e.Item
      Dim u As New SalonUtilities
      If e.CommandName = "CreateService" Then 'can i add text

         ClearCompleteService()

         Dim sSchedID As String = Me.lstSchedules.DataKeys(dataItem.DisplayIndex).Value.ToString
         Dim iSchedID As Integer = u.ReturnInteger(sSchedID)
         Me.txtSchedID.Text = sSchedID
         Dim hServID As HiddenField = DirectCast(item.FindControl("HiServiceID"), HiddenField)
         Dim sServID As String = hServID.Value.ToString
         Dim iServID As Integer = u.ReturnInteger(sServID)
         Dim sLUServID As String = DirectCast(e.CommandArgument, String)
         Dim iLUServID As Integer = u.ReturnInteger(sLUServID)
         Dim hiCustID As HiddenField = DirectCast(item.FindControl("HiCustID"), HiddenField)
         Dim sClientID As String = hiCustID.Value.ToString
         Dim iClientID As Integer = u.ReturnInteger(sClientID)
         Me.HiCustomerID.Value = sClientID
         EvalServiceFromSelectedAppt(iClientID, iLUServID, iServID, iSchedID)

         Me.chkAddPicsToPortfolio.Checked = True
         '   ScriptManager.RegisterStartupScript(Me, Me.[GetType](), "clickcreateschedule", "clickcreateschedule(1);", True)
         Dim lbl As Label = DirectCast(item.FindControl("lblClient"), Label)
         If Not lbl Is Nothing Then
            Me.lblClientName.Text = lbl.Text
         End If
         FillPictures()
         EnableDisable()
      ElseIf e.CommandName = "DeleteSched" Then
         Dim sSchedID As String = Me.lstSchedules.DataKeys(dataItem.DisplayIndex).Value.ToString
         Dim iSchedID As Integer = u.ReturnInteger(sSchedID)
         Using dc As New SalonDataClassesDataContext
            Dim sch = (From p In dc.Schedules Where p.SchedID = iSchedID Select p).FirstOrDefault
            dc.Schedules.DeleteOnSubmit(sch)
            dc.SubmitChanges()
         End Using
         FillSchedules()
      ElseIf e.CommandName = "NoShow" Then
         Dim tr As HtmlTableRow = DirectCast(item.FindControl("trNoShowDetails"), HtmlTableRow)
         ShowHideTree(tr)
      ElseIf e.CommandName = "NoShowCancel" Then
         Dim tr As HtmlTableRow = DirectCast(item.FindControl("trNoShowDetails"), HtmlTableRow)
         ShowHideTree(tr)
      ElseIf e.CommandName = "NoShowUpdate" Then
         Dim tr As HtmlTableRow = DirectCast(item.FindControl("trNoShowDetails"), HtmlTableRow)
         Dim hiCustID As HiddenField = DirectCast(item.FindControl("HiCustID"), HiddenField)
         Dim sClientID As String = hiCustID.Value.ToString
         Dim iClientID As Integer = u.ReturnInteger(sClientID)
         Dim sSchedID As String = Me.lstSchedules.DataKeys(dataItem.DisplayIndex).Value.ToString
         Dim iSchedID As Integer = u.ReturnInteger(sSchedID)

         Dim chk As CheckBox = DirectCast(item.FindControl("chkNoSched"), CheckBox)
         Dim txt As TextBox = DirectCast(item.FindControl("txtNoShowDetails"), TextBox)
         Using dc As New SalonDataClassesDataContext
            Dim noshow As New ScheduleNoShow
            noshow.CustomerID = iClientID
            noshow.SchedDate = Convert.ToDateTime(Me.txtCalendar.Text)
            noshow.NoShowDetails = txt.Text


            dc.ScheduleNoShows.InsertOnSubmit(noshow)

            dc.SubmitChanges()

            If chk.Checked Then
               Dim q = (From p In dc.Clients Where p.CustomerID = iClientID Select p).FirstOrDefault

               q.BlockScheduling = True
               dc.SubmitChanges()

            End If
            Dim sch = (From p In dc.Schedules Where p.SchedID = iSchedID Select p).FirstOrDefault

            dc.Schedules.DeleteOnSubmit(sch)
            dc.SubmitChanges()

         End Using

         ShowHideTree(tr)
         FillSchedules()
      End If
      ' 
   End Sub

### Javascript

function clickcreateschedule(itemindex) {
      var item = "li_" + itemindex;
      var itemsched = "li_" + "0";
      var div0 = document.getElementById("div_0");
      var div1 = document.getElementById("div_1");
      div1.style.display = "block";
      div0.style.display = "none";
      updateupdatepanel(0);
      updateupdatepanel(1);
      var obj = document.getElementById(item);
      var objSched = document.getElementById(itemsched);
      objSched.style.color = '#000000';
      objSched.style.backgroundColor = '#b9d0ff';
      obj.style.color = '#FFFFFF';
      obj.style.backgroundColor = '#000000';

      return false;
   }

Open in new window

Dale Burrell

You can't... well not easily... javascript executes at the browser (client) which happens before the page is posted back to the server. Code behind runs on the server, so cannot run until the page has been posted to the server and is available to run.

There are three potential solutions I can think of:

1) Change your logic to work with the javascript first (maybe easier).

2) Send the request to the server to run the code behind using Ajax and then once the result is back run the local javascript (a bit complex if you're not already using ajax, but otherwise a nice solution)

3) Post the form back, run your code behind, and then embed the javascript you wish to run back into the page and set it to run once the page load is complete (a bit messy).

leakim971

http://weblogs.asp.net/sohailsayed/archive/2008/02/23/calling-methods-in-a-codebehind-function-pagemethods-from-client-side-using-ajax-net.aspx
http://www.dotnetcurry.com/ShowArticle.aspx?ID=109

In this case you only use OnClientClick="callpagemethod(itemindex)" and not OnClick

in the Page_Method success function you have :

function CallSuccess(res, destCtrl)
{
clickcreateschedule(itemindex); // you previously save itemindex

ASKER CERTIFIED SOLUTION

Miguel Oz

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Sheritlw

ASKER

Thank you