もはやASPに焦点を当てていない場合に発生させるC＃の機能を取得します：ときにテキストボックス「txtAppTrackingID_App私は起こるしたいもののTextBox

Question

<div id="pm-search" class="main-box-body-only min-padding clearfix"> 
 
          <div class="searchFormNoBox span12"> 
 
           <span> 
 
            <label>App Tracking ID</label> 
 
            <asp:TextBox ID="txtAppTrackingID_App" runat="server" Width="100px" OnTextChanged="txtAppTrackingID_App_TextChanged" AutoPostBack="True"></asp:TextBox> 
 
           </span> 
 
           <span> 
 
            <label>Old Status</label> 
 
            <asp:DropDownList ID="ddlOldStatus_App" runat="server" AutoPostBack = "true" Width="170px"> 
 
             <asp:ListItem Value="" Selected="True"></asp:ListItem> 
 
             <asp:ListItem Value="AWAITING_CONF">AWAITING_CONF</asp:ListItem> 
 
             <asp:ListItem Value="AWAITING_DUPLICATE_FILE">AWAITING_DUPLICATE_FILE</asp:ListItem> 
 
             <asp:ListItem Value="CANCELLED">CANCELLED</asp:ListItem> 
 
             <asp:ListItem Value="COMPLETE">COMPLETE</asp:ListItem> 
 
             <asp:ListItem Value="CONFIRM_APPROVED">CONFIRM_APPROVED</asp:ListItem> 
 
             <asp:ListItem Value="CONFIRM_REJECTED">CONFIRM_REJECTED</asp:ListItem> 
 
             <asp:ListItem Value="COPY_FINISHED">COPY_FINISHED</asp:ListItem> 
 
             <asp:ListItem Value="COPY_STARTED">COPY_STARTED</asp:ListItem> 
 
             <asp:ListItem Value="DUPLICATE_FILE_APPROVED">DUPLICATE_FILE_APPROVED</asp:ListItem> 
 
             <asp:ListItem Value="DUPLICATE_FILE_REJECTED">DUPLICATE_FILE_REJECTED</asp:ListItem> 
 
             <asp:ListItem Value="EMAIL_READY">EMAIL_READY</asp:ListItem> 
 
             <asp:ListItem Value="EMAIL_COMPLETE">EMAIL_COMPLETE</asp:ListItem> 
 
             <asp:ListItem Value="ERROR">ERROR</asp:ListItem> 
 
             <asp:ListItem Value="FILE_PROCESSING">FILE_PROCESSING</asp:ListItem> 
 
             <asp:ListItem Value="FILE_READY">FILE_READY</asp:ListItem> 
 
             <asp:ListItem Value="FILE_RECEIVED">FILE_RECEIVED</asp:ListItem> 
 
             <asp:ListItem Value="HOLD">HOLD</asp:ListItem> 
 
             <asp:ListItem Value="PROCESSING_APP">PROCESSING_APP</asp:ListItem> 
 
             <asp:ListItem Value="PROCESSING_QC">PROCESSING_QC</asp:ListItem> 
 
             <asp:ListItem Value="QUICKCHANGE_READY">QUICKCHANGE_READY</asp:ListItem> 
 
             <asp:ListItem Value="READY">READY</asp:ListItem> 
 
             <asp:ListItem Value="SCHEDULED">SCHEDULED</asp:ListItem> 
 
             <asp:ListItem Value="WEBVIEW_READY">WEBVIEW_READY</asp:ListItem> 
 
            </asp:DropDownList> 
 
           </span>

protected void txtAppTrackingID_App_TextChanged(object sender, EventArgs e) 
    { 
     applicationTrackingID = txtAppTrackingID_App.Text; 
     ApplicationSettings applicationStatus = new ApplicationSettings(appTrackingID); 
     appStatus = applicationStatus.StatusCode; // get the full status code name 

     ddlOldStatus_App.SelectedValue = appStatus; 

    } 

は、上記の機能を実行することです"はもはや焦点ではありません。

機能の目的は、あなたのビューに以下を追加し、そのID

Answer 1

でオブジェクトの状態と一致するドロップダウンメニューから値を選択することです。

<script type="text/javascript"> 
    $("#txtAppTrackingID_App").blur(function() { 
     $.post("/controller/method" + id); 
    }); 
</script> 

Answer 2

注意：サーバーのコード内のテキストボックスのみが最終的に動作するブラウザ用のHTMLをレンダリングするために使用される一時的な構築物を扱っています。実際のテキストボックスは、サーバー上ではなく、ブラウザにのみ存在します。このようなUI変更が発生したときにC＃サーバーコードを実行する唯一の方法は、サーバーに返信するです。

ブラウザが新しいHTTPリクエストをサーバーに送信し、ローカルDOMを破棄し、HTTPレスポンスを待って新しいDOMを構築し、それを画面にレンダリングすることを意味します。これは、サーバーがページ全体に対して全く新しいHTMLセットを生成していることを意味しています。ただ1つの機能を実行するだけではありません。

これは本当に起こりたいことですか？ほとんどの場合、あなたは本当に完全にjavascriptでこの作業を扱いたいと思っています。

Answer 3

ここで私はWebFormsでそれをやったことがあります。あなたがその方法の一部（WebMethodを使用している）のように聞こえます。

はPageNameGoesHere.aspxであなたのWebMethod属性を作成します。

[WebMethod] 
public static bool DoSomething(int id) 
{ 
    // do something on id 
} 

を（それがクリックにあった鉱山のために、ぼかしのためにテストされていない）、Ajaxを介して、それを呼び出すためにJavaScriptを作成します。

$('form').on('blur', '#txtAppTrackingID', function() { 
    var data = new Object(); 
    data['id'] = 12; 

    $.ajax({ 
    url: 'PageNameGoesHere.aspx/DoSomething', 
    type: 'POST', 
    contentType: 'application/json; charset=utf-8', 
    data: JSON.stringify(data), 
    success: function (response) { 
     // whatever you want to do on success. 
    }, 
    error: function (response) { 
     // probably some messaging something went wrong. 
    } 
    }) 
});