在 modeldata 之后运行 JavaScript 代码是有效的
本文关键字:有效 代码 JavaScript modeldata 之后 运行 | 更新日期: 2023-09-27 18:31:35
我正在开发一个Facebook应用程序,我有一个用户填写的表格,当它被提交时,我想通过facebook画布付款向他们收费。当然,这意味着模型数据首先需要有效,但我总是觉得 mvc 代码只有在 javascript 代码调用它之后才运行。我将如何在下面的 mvc 方法中调用这个 javascript 命令?
function buy() {
var obj = {
method: 'pay',
action: 'purchaseitem',
product: 'https://mywebsite.net/product.html'
};
FB.ui(obj, function(data) {
console.log(data);
});
}
**document.getElementById('submitbtn').onclick = function() {buy()};** // trying to only call this after model data is valid
};
[HttpPost]
public ActionResult Contact(Project.Models.Order c)
{
decimal price = 0;
if (ModelState.IsValid)
{
try
{
// call javascript code here to open the window
}
catch (Exception)
{
return View("Error");
}
}
return View("Index");
}
public async Task<ActionResult> Index(FacebookContext context)
{
if (ModelState.IsValid)
{
//var user = await context.Client.GetCurrentUserAsync<MyAppUser>();
//var client = new FacebookClient(context.AccessToken);
//dynamic me = client.Get("me");
//string name = me.Name;
loadDropDownLists();
return View();
}
return View("Error");
}
索引视图
@using HomeworkHelpers.Models
@using Microsoft.AspNet.Facebook.Models
@model HomeworkHelpers.Models.Order
@{
ViewBag.Title = "Home Page";
}
@section PageScripts{
<script type="text/javascript">
$(document).ready(function () {
$('#documentTypeList').change(function () {
var modelData = {
documentType: $('#documentTypeList').val(),
urgency: $('#urgencyList').val(),
numberOfPages: $('#numberOfPagesList').val()
};
$.ajax({
type: "GET",
data: modelData,
url: "/Home/getNewPrice",
async: true,
success: function (data) {
$('#priceLabel').html(data.currentPrice);
$('#UnFormattedPrice').val(data.unformattedCurrectPrice);
}
});
});
$('#numberOfPagesList').change(function () {
var modelData = {
documentType: $("#documentTypeList").val(),
urgency: $("#urgencyList").val(),
numberOfPages: $("#numberOfPagesList").val()
};
$.ajax({
type: "GET",
data: modelData,
url: "/Home/getNewPrice",
async: true,
success: function (data) {
$('#priceLabel').html(data.currentPrice);
$('#UnFormattedPrice').val(data.unformattedCurrectPrice);
}
});
});
$('#urgencyList').change(function () {
var modelData = {
documentType: $("#documentTypeList").val(),
urgency: $("#urgencyList").val(),
numberOfPages: $("#numberOfPagesList").val()
};
$.ajax({
type: "GET",
data: modelData,
url: "/Home/getNewPrice",
async: true,
success: function (data) {
$('#priceLabel').html(data.currentPrice);
$('#UnFormattedPrice').val(data.unformattedCurrectPrice);
}
});
});
$('.spacing').click(function () {
var select = $("#numberOfPagesList");
select.empty().append($('<option></option>').val('').text('--Select--'));
var url = '@Url.Action("NumberOfPagesList", "Home")';
$.getJSON(url, { id: $(this).val() }, function (data) {
$.each(data, function (i, item) {
select.append($('<option></option').val(item.Value).text(item.Name));
});
});
});
$('#currencyList').change(function () {
$.ajax({
type: "GET",
url: "/Home/changeCurrency?newCurrency=" + this.value,
async: true,
success: function (result) {
$('#priceLabel').html(result.currentPrice);
}
});
});
});
</script>
@if (Model.Buy)
{
<script>
$(document).ready(function () {
buy();
});
</script>
}
}
@using (Html.BeginForm("Contact", "Home", FormMethod.Post))
{
@Html.ValidationSummary(true)
<div class="row">
@Html.LabelFor(model => model.Name, "Name:")
@Html.EditorFor(model => model.Name)
@Html.ValidationMessageFor(model => model.Name)
</div>
<div class="row">
@Html.LabelFor(model => model.Email, "Email:")
@Html.EditorFor(model => model.Email, new { id = "email" })
@Html.ValidationMessageFor(model => model.Email)
</div>
<div class="row">
@Html.LabelFor(model => model.PhoneNumber, "Phone Number:")
@Html.EditorFor(model => model.PhoneNumber, new { id = "phoneNumber" })
@Html.ValidationMessageFor(model => model.PhoneNumber)
</div>
<div class="row">
@Html.LabelFor(model => model.Topic, "Topic:")
@Html.EditorFor(model => model.Topic)
@Html.ValidationMessageFor(model => model.Topic)
</div>
<div class="row">
@Html.LabelFor(model => model.Subject, "Subject:")
@Html.DropDownListFor(model => model.Subject, (SelectList)ViewBag.subject, "--Select--", new { id = "subjectList" })
@Html.ValidationMessageFor(model => model.Subject)
</div>
<div class="row">
@Html.LabelFor(model => model.Style, "Style:")
@Html.DropDownListFor(model => model.Style, (SelectList)ViewBag.paperStyle, "--Select--", new { id = "paperStyleList" })
@Html.ValidationMessageFor(model => model.Style)
</div>
<div class="row">
@Html.LabelFor(model => model.DocumentType, "Document Type:")
@Html.DropDownListFor(model => model.DocumentType, (SelectList)ViewBag.documentType, "--Select--", new { id = "documentTypeList" })
@Html.ValidationMessageFor(model => model.DocumentType)
</div>
<div class="row">
@Html.LabelFor(model => model.AcademicLevel, "Academic Level:")
@Html.DropDownListFor(model => model.AcademicLevel, (SelectList)ViewBag.academicLevel, "--Select--", new { id = "academicLevelList" })
@Html.ValidationMessageFor(model => model.AcademicLevel)
</div>
<div class="row">
@Html.LabelFor(model => model.NumberOfPages, "Number of Pages/Words:")
@Html.DropDownListFor(model => model.NumberOfPages, (SelectList)ViewBag.numberOfPages, "--Select--", new { id = "numberOfPagesList" })
@Html.ValidationMessageFor(model => model.NumberOfPages)
</div>
<div class="row">
@Html.LabelFor(model => model.NumberOfSources, "Number of Sources:")
@Html.DropDownListFor(model => model.NumberOfSources, (SelectList)ViewBag.numberOfSources, "--Select--", new { id = "numberOfSourcesList" })
@Html.ValidationMessageFor(model => model.NumberOfSources)
</div>
<div class="row">
@Html.LabelFor(model => model.Urgency, "Urgency:")
@Html.DropDownListFor(model => model.Urgency, (SelectList)ViewBag.urgency, "--Select--", new { id = "urgencyList" })
@Html.ValidationMessageFor(model => model.Urgency)
</div>
<div class="row">
@Html.LabelFor(model => model.Spacing, "Spacing:")
@Html.RadioButtonFor(m => m.Spacing, "Double", new { @class = "spacing", id = "double", @Checked = "checked" }) Double
@Html.RadioButtonFor(m => m.Spacing, "Single", new { @class = "spacing", id = "single" }) Single
@Html.ValidationMessageFor(model => model.Spacing)
</div>
<div class="row">
@Html.LabelFor(model => model.Requirements, "Requirements:")
@Html.TextAreaFor(model => model.Requirements)
@Html.ValidationMessageFor(model => model.Requirements)
</div>
<div class="row">
@Html.DropDownListFor(model => model.Currency, (SelectList)ViewBag.currency, null, new { id = "currencyList" })
<h2 id="priceLabel">
@Html.DisplayFor(model => model.Price)
</h2>
@Html.HiddenFor(model => model.UnFormattedPrice)
<input type="submit" value="Submit" />
<input type="reset" value="Reset" />
</div>
}
型
namespace HomeworkHelpers.Models
{
public class Order
{
public int ID { get; set; }
[Required(ErrorMessage = "Name is required")]
public string Name { get; set; }
[EmailAddress(ErrorMessage = "A Valid Email Address is Required.")]
[Required(ErrorMessage = "Email Address is Required.")]
public string Email { get; set; }
[Phone(ErrorMessage = "A Valid Phone Number is Required.")]
[Required(ErrorMessage = "Phone Number is Required.")]
public string PhoneNumber { get; set; }
[Required(ErrorMessage = "Subject is Required.")]
public string Subject { get; set; }
[Required(ErrorMessage = "Topic is Required.")]
public string Topic { get; set; }
[Required(ErrorMessage = "Document Type is Required.")]
public string DocumentType { get; set; }
[Required(ErrorMessage = "Urgency is Required.")]
public string Urgency { get; set; }
[Required(ErrorMessage = "Number of Pages is Required.")]
public Int16 NumberOfPages { get; set; }
[Required(ErrorMessage = "Requirements are Required.")]
[DataType(DataType.MultilineText)]
[StringLength(200)]
public string Requirements { get; set; }
[Required(ErrorMessage = "Writing Style is Required.")]
public string Style { get; set; }
[Required(ErrorMessage = "Spacing is Required.")]
public string Spacing { get; set; }
[Required(ErrorMessage = "Academic Level is Required.")]
public string AcademicLevel { get; set; }
[Required(ErrorMessage = "Number of Sources is Required.")]
public Int16 NumberOfSources { get; set; }
[Required(ErrorMessage = "Price is Required.")]
[Range(0.01, 10000.00, ErrorMessage = "Your quote is not complete because you haven't completed all of the steps.")]
[DataType(DataType.Currency)]
[DisplayFormat(DataFormatString = "{0:C}")]
public decimal Price { get; set; }
public string UnFormattedPrice { get; set; }
[Required(ErrorMessage = "Currency is Required.")]
public string Currency { get; set; }
public string PaymentID { get; set; }
public string PayerID { get; set; }
// current properties
public bool Buy { get; set; }
}
public class OrderDBContext : DbContext
{
public DbSet<Order> Orders { get; set; }
}
}
在模型验证成功后将 ViewBag.Buy 属性值设置为 true 并返回视图:
[HttpPost]
public ActionResult Contact(Project.Models.Order c)
{
decimal price = 0;
if (ModelState.IsValid)
{
try
{
ViewBag.Buy = true;
return View("Index", c)
}
catch (Exception)
{
return View("Error");
}
}
return View("Index");
}
在索引页的末尾添加以下 Java 脚本代码:
@if (ViewBag.Buy != null && ViewBag.Buy == true)
{
<script>
$(document).ready(function () {
buy();
});
</script>
}