1

私のアプリケーションでは、すべてのビューに共通のレイアウトがあります。ビュー(Index.cshtml)の1つからAjax.BeginForm、応答として別のビューを表示するために使用したコードは 次のとおりです。

@using (Ajax.BeginForm("Edit", "Home", new AjaxOptions { UpdateTargetId = "content",InsertionMode=InsertionMode.Replace }))

今私の問題は、編集ビューが期待どおりにレンダリングされる応答としてですが、編集ビューのスクリプトブロックが含まれていないため、javascriptが実行されません。

@model Test.Models.CARE
@{
ViewBag.Title = "Edit";
}
<script>
function s() {
alert("hi");
}
</script>
<h2 style="padding: 0px; margin-top: 0px;"> Edit</h2>
@using (Html.BeginForm("SaveForConfirmation", "Home"))
{

助けてください。

4

2 に答える 2

4

部分的なビューはもちろんのこと、JavaScript コードをビューに入れるのは悪い習慣です。したがって、この JavaScript コードを別の JavaScript ファイルの別の関数に外部化することをお勧めします。

そしてOnSuccess、Ajax.BeginForm ヘルパーのイベントをサブスクライブできます。

@using (Ajax.BeginForm("Edit", "Home", new AjaxOptions { OnSuccess = "editSuccess", UpdateTargetId = "content", InsertionMode = InsertionMode.Replace }))
{
    ...    
}

次に、別のJavaScript ファイルeditSuccessで関数を定義します。

function editSuccess(result) {
    alert('hi');
}

部分的なビューでは、部分的なマークアップにあるはずのものだけを残す必要があります。<script>不要なタグはすべて削除してください。インライン スクリプトは必要ありません。それらはブラウザによってキャッシュできないため、ウェブページのサイズを増やし、帯域幅を浪費するだけです:;

@model Test.Models.CARE
<h2 style="padding: 0px; margin-top: 0px;">Edit</h2>
@using (Html.BeginForm("SaveForConfirmation", "Home"))
{
    ...
}

アップデート：

パーシャル内の ViewBag のようながらくたに依存する、よく書かれていない JavaScript がある場合は、OnSuccess コールバック内から対応する関数を呼び出すことができます。

@using (Ajax.BeginForm("Edit", "Home", new AjaxOptions { OnSuccess = "s", UpdateTargetId = "content", InsertionMode = InsertionMode.Replace }))
{
    ...    
}

OnSuccess = "s"パーシャルで定義した関数がどこsにあり、この場合に呼び出される関数をどのように定義したかに注目してください。しかし、繰り返しますが、これは間違ったアプローチであり、コードを適切にリファクタリングする時間がない場合にのみ使用してください。

于 2012-09-24T12:28:13.167 に答える
0

ついに必要な機能を実現しました。

これが私がやった方法です

ビュー (呼び出しが行われた場所から)

<input type="submit" value="Create" />
@using (Ajax.BeginForm("Edit", "Home", new AjaxOptions {OnSuccess="DisableControls()",
InsertionMode= InsertionMode.Replace,UpdateTargetId="DivToUpdate" }))

コントローラー 

[HttpPost]
    public ActionResult Edit(FormCollection fc)
    {
        if (fc.Keys[0].ToString().TrimEnd() == "Display")
        {
            TempData["readonly"] = "readonly";
        }
        else
            TempData["readonly"] = "";

呼び出された部分ビュー

@model TestApp.Models.CUSTOMER
@{
    ViewBag.Title = "Edit";
}
<script>
function s() {
    var readonly="@TempData["readonly"].ToString()";
    if(readonly=="readonly")
       { 
       $('input[type="text"],select').attr('readonly','readonly');         
       $("#Save").remove();
       }
}
</script>
<h2 style="padding: 0px; margin-top: 0px;">
Edit</h2>
@using (Html.BeginForm("Save", "Home"))
{


@Html.ValidationSummary()

<fieldset>
    <legend>CUSTOMER</legend>
    <table style="margin: 0px auto;">
        <tr>
            <td>

alert()ここで、前回の失敗の試行の原因を診断する際に、スクリプトが実行されているかどうかを確認するためにスクリプトにを書きました。

<script>
   function s() {
       var readonly="@TempData["readonly"].ToString()";var s="hi"+ prompt("name","");
       alert(s);
       if(readonly=="readonly")
          { //To make all text boxes and dropdown readonly
            $('input[type="text"],select').attr('readonly','readonly');         
            $("#Save").remove();//To Remove the save button
          }
       }
</script>

firebug をさらに調べると、応答にスクリプトが含まれていることがわかりました 

<script>
function s() {
    var readonly="readonly";var s="hi"+ prompt("sdfs","kakaji");
    alert(s );
    if(readonly=="readonly")
       { 
       $('input[type="text"],select').attr('readonly','readonly');         
       $("#Save").remove();
       }
}
</script>
<form action="/Grid/Save" method="post"><div class="validation-summary-valid" data-valmsg-summary="true">  
<ul><li style="display:none"></li></ul>
</div>
<fieldset>
    <legend>CUSTOMER</legend>
    <table style="margin: 0px auto;">
        <tr>
            <td>
                <div class="editor-label">

しかし、生成されたページには、ここで理由を見つけたスクリプトが含まれていないことがわかりました

したがって、これは私の問題を解決し、なぜAjax応答からスクリプトタグを表示または監視できなかったのかという事実の背後にある理由を教えてくれました。

于 2012-09-25T08:19:48.523 に答える