Call-Funktion von Code hinter in Javascript ohne Postback

Question

Ich habe eine Liste der Kunden, die der Benutzer wählen kann. Wenn sie einen Kunden auswählen, muss ich die Kontakte dieses Kunden laden. Ich brauchte die Funktion von JavaScript zu rufen, damit ich eine Schaltfläche hinzugefügt:

<asp:Button ID="btnSample" runat="server" style="float:right;display:none" OnClick="btnSample_Click" /> 

und diesen Knopf dann von meinem JavaScript-Funktion ausgelöst wird:

function OnGetCustomer(result){ 
       document.getElementById('lblCustID').innerHTML = result.ID; 
       document.getElementById('lblCustName').innerHTML = result.Name; 
       document.getElementById("btnSample").click(); 
} 

-Code hinter die Kontakte zu laden:

protected void btnSample_Click(object sender, EventArgs e) 
    { 
     RateSheet r = new RateSheet(ID, Company.Current.CompanyID); 
     if (!string.IsNullOrEmpty(lblCustID.Text)) 
     { 
      Customer c = new Customer(int.Parse(lblCustID.Text)); 

      bool e2 = false; 
      foreach (Customer.CustomerContact cc in c.Contacts) 
      { 
       HtmlGenericControl li = new HtmlGenericControl("li"); 
       CheckBox cb = new CheckBox(); 
       cb.ID = "cbCustContact_" + cc.ID; 
       cb.Checked = true; 
       if (!string.IsNullOrEmpty(cc.Email)) 
       { 
        cb.Text = cc.Email; 
        cb.TextAlign = TextAlign.Right; 
        li.Controls.Add(cb); 
        ulCustContacts.Controls.Add(li); 
       } 
      } 
     } 
    } 

Ich brauche den Wert von lblCustID, um die Kontakte des Kunden zu finden. Das Problem ist, dass der Button Postback verursacht und ich den Kunden verliere, den ich ausgewählt habe, so dass lblCustID immer als Null zurückkommt. Wie stoppe ich Postback, damit ich keine Werte verliere?

Answer 1

Ist lblCustID ein Etikett oder ein Eingang? Die einzigen * Steuerelemente, in denen Änderungen im Postback beibehalten werden, sind Eingaben. Sie können <asp:HiddenField /> oder einen beliebigen <input runat="server" ... /> verwenden, um Informationen für den Code zu senden, mit dem gearbeitet werden soll.

* Zusammen mit anderen Kontrollen wie Dropdownlists etc

Answer 2

Sie asynchronen Aufruf, das erreichen verwenden können:

Set Autopostback = "false" die Schaltfläche, um zu verhindern Postbacks zu verursachen Onclick

<asp:Button ID="btnSample" runat="server" style="float:right" AutoPostback="false" /> 

Oder fügen Sie einfach eine rohe HTML-Schaltfläche (ACHTUNG: fügen Sie eine type = "Schaltfläche" oder dies wird ein Postback verursachen):

<button id="btnSample" type="button">Click</button> 

Dann einen Ereignis-Listener auf diese Schaltfläche hinzufügen, und führen Sie den Ajax-Aufruf:

$(document).on('click', '[id$=btnSample]', function() { 
    ajax({ 
     url: 'path/to/handler', 
     method: 'POST', 
     data: { key: 'value', ... }, 
     success: function(data) { 
     OnGetCustomer(data); 
     }, 
     error: function() { 
     console.log('Error on ajax call!'); 
     } 
    }); 
}); 

HINWEIS: Sie haben Ihren cobebehind Code in einen generischen Handler zu bewegen, um den Ajax-Aufruf zu handhaben und kehren die Ergebnis