Javascript错误:Uncaught ReferenceError:使用AJAX

时间:2017-06-04 13:46:06

标签: jquery ajax

当我第一次提交表单时,一切都运行良好,我回到同一页面,并显示成功消息。问题是,当我再次按下提交按钮时,页面会重新加载,但JavaScript不会被加载。  这是容器页面的一部分:

<div id="tabs">
    <ul>
        <li>
            <a href="#project-details">Project Details</a>
        </li>
        <li>
            <a href="#client-pricing-container">Client Pricing</a>
        </li>
        <li>
            <a href="#vendor-pricing-container">Vendor Pricing</a>
        </li>
        <li>
            <a href="#status">Status</a>
        </li>
    </ul>

    <div id="project-details">
        @Html.Partial("Partial/ProjectDetails")
    </div>
    <div id="client-pricing-container">
        @Html.Partial("Partial/ClientPricing")
    </div>
    <div id="vendor-pricing-container">
        @Html.Partial("Partial/VendorPricing")
    </div>
    <div id="status">
        @Html.Partial("Partial/ProjectStatus")
    </div>
</div>

<script type="text/javascript">
    $(document).ready(function() {
        $("#tabs").tabs();
    });
    @if (Model.Project?.ProjectPricings != null)
    {
        @:numberOfPricings = @Model.Project.ProjectPricings.Count;
            }
    sourceCodeList =  '@Html.Raw("<option></option>" + string.Join("", Model.SourceCodeList.Select(x => "<option value=\"" + HttpUtility.JavaScriptStringEncode(x.SourceCode) + "\">" + HttpUtility.JavaScriptStringEncode(x.SourceCode) + "</option>")))';
    targetCodeList = '@Html.Raw("<option></option>" + string.Join("", Model.TargetCodeList.Select(x => "<option value=\"" + HttpUtility.JavaScriptStringEncode(x.TargetCode) + "\">" +  HttpUtility.JavaScriptStringEncode(x.TargetCode) + "</option>")))';
    unitTypeCodeList = '@Html.Raw("<option></option>" + string.Join("", Model.UnitTypeCodeList.Select(x =>"<option value=\"" + HttpUtility.JavaScriptStringEncode(x.UnitTypeCode) + "\">" +  HttpUtility.JavaScriptStringEncode(x.UnitTypeCode) + "</option>")))';
    currencyList = '@Html.Raw("<option></option>" + string.Join("", Model.CurrencyList.Select(x =>"<option value=\"" + HttpUtility.JavaScriptStringEncode(x.CurrencyCode) + "\">" +  HttpUtility.JavaScriptStringEncode(x.CurrencyCode) + "</option>")))';
    serviceCodeList = '@Html.Raw("<option></option>" + string.Join("", Model.ServiceCodeList.Select(x => "<option value=\"" + HttpUtility.JavaScriptStringEncode(x.ServiceCode) + "\">" +  HttpUtility.JavaScriptStringEncode(x.ServiceCode) + "</option>")))';
    frequencyList = '@Html.Raw("<option></option>" + string.Join("", Model.VolumeFrequencyList.Select(x => "<option value=\"" + HttpUtility.JavaScriptStringEncode(x.VolumeFrequency.ToString()) + "\">" +  HttpUtility.JavaScriptStringEncode(x.VolumeFrequencyDescription) + "</option>")))';

    var form = $('#client-pricing-form');
    form.submit(function(e) {
        e.preventDefault();
        $.ajax({
            type: form.attr('method'),
            url: form.attr('action'),
            data: form.serialize(),
            success: function(data) {
                $("#client-pricing-container").html(data);
            },
            error: function(data) {
                $("#client-pricing-container").html("<h1 style='color:red'>Ajax Error!</h1>");
                console.log('An ajax error occurred.');
                console.log(data);
            }
        });
    });

</script>

这是部分视图的一部分:

<div style="text-align: center;">
                <input type="submit" id="submit-price-button" value="SAVE">
            </div>
        </div>

    }

<script type="text/javascript">
    $('#submit-price-button').button();

    var selectedSourcesArray = @Html.Raw("{" + string.Join(",", Model.Project?.ProjectPricings?.Select((x, i) => i + ":\"" + HttpUtility.JavaScriptStringEncode(x.SourceCode) + "\"") ?? new List<string>()) + "}");
    var selectedTargetsArray = @Html.Raw("{" + string.Join(",", Model?.Project?.ProjectPricings?.Select((x, i) =>i + ":\"" + HttpUtility.JavaScriptStringEncode(x.TargetCode) + "\"") ?? new List<string>()) + "}");
    var selectedUnitTypeCodeArray = @Html.Raw("{" + string.Join(",", Model?.Project?.ProjectPricings?.Select((x,i) =>i + ":\"" + HttpUtility.JavaScriptStringEncode(x.UnitTypeCode) + "\"") ?? new List<string>()) + "}");
    var selectedUnitTypePriceArray = @Html.Raw("{" + string.Join(",", Model?.Project?.ProjectPricings?.Select((x, i) => i + ":\"" + x.UnitTypePrice + "\"") ?? new List<string>()) + "}");
    var selectedUnitTypePriceCurrencyArray = @Html.Raw("{" + string.Join(",", Model?.Project?.ProjectPricings?.Select((x, i) => i + ":\"" + HttpUtility.JavaScriptStringEncode(x.UnitTypePriceCurrency) + "\"") ?? new List<string>()) + "}");
    var selectedUnitTypePriceDescriptionArray = @Html.Raw("{" + string.Join(",", Model?.Project?.ProjectPricings?.Select((x, i) => i + ":\"" + HttpUtility.JavaScriptStringEncode(x.UnitTypePriceDescription) + "\"") ?? new List<string>()) + "}");
    var selectedUnitTypePriceEffDate = @Html.Raw("{" + string.Join(",", Model.Project?.ProjectPricings?.Select((x, i) => i + ":\"" + x.UnitTypePriceEffDate.ToString() + "\"") ?? new List<string>()) + "}");
    var selectedUnitTypePriceExpDate = @Html.Raw("{" + string.Join(",", Model?.Project?.ProjectPricings?.Select((x, i) => i + ":\"" + x.UnitTypePriceExpDate.ToString() + "\"") ?? new List<string>()) + "}");
    var selectedServicesArray = @Html.Raw("{" + string.Join(",", Model?.Project?.ProjectPricings?.Select((x, i) =>i + ":\"" + HttpUtility.JavaScriptStringEncode(x.ServiceCode) + "\"") ?? new List<string>()) + "}");
    var selectedActualUnitTypeVolumeArray = @Html.Raw("{" + string.Join(",", Model?.Project?.ProjectPricings?.Select((x, i) => i + ":\"" + HttpUtility.JavaScriptStringEncode(x.ActualUnitTypeVolume) + "\"") ?? new List<string>()) + "}");
    var selectedVolumeFrequencyArray = @Html.Raw("{" + string.Join(",", Model?.Project?.ProjectPricings?.Select((x, i) =>  i + ":\"" + x.VolumeFrequency + "\"") ?? new List<string>()) + "}");

    $(document).ready(function() {
        for (var i = 0; i < numberOfPricings; i++) {
            AddPricing(i);
        }
    });
</script>

这是控制器:

 [HttpPost]
        public ActionResult UpdateProjectPricing(ProjectDetailsViewModel projectViewModel)
        {
            if (!ModelState.IsValid)
            {
                projectViewModel.ReturnMessage = @"Error! Update Failed.";
                projectViewModel.ReturnClass = "error-message";
                return PartialView("Partial/ClientPricing", projectViewModel);
            }
            var success = ProjectDataAccess.UpdateClientPricingDetails(projectViewModel.Project);
            projectViewModel.ReturnMessage = success ? @"Pricing Updated Successfully!" : @"Error! Undate Failed";
            projectViewModel.ReturnClass = success ? @"success-message" : @"error-message";

            return PartialView("Partial/ClientPricing", projectViewModel);

        }

0 个答案:

没有答案