1

在我的应用程序中，我有一个用于所有视图的通用布局，从一个视图（Index.cshtml）我用来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 代码外部化。

然后您可以订阅OnSuccessAjax.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"))
{
    ...
}

更新：

如果您有一些编写不佳的 javascript 依赖于部分内部的 ViewBag 之类的废话，那么您可以从 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>

在进一步查找萤火虫时，我可以看到响应包含脚本 

<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 回答