backbone.js 在JQuery不工作的情况下将输入追加到HTML表单

hujrc8aj 于 2022-11-10 发布在 jQuery

关注(0)|答案(2)|浏览(184)

我试图在用 AJAX 发送之前用JQuery表单将输入附加到HTML中，但它没有被附加，因为我在后端看到字段为空。下面是我的HTML表单：

<form class="basketForm loginForm" id="@formId" autocomplete="off" captcha="false">
        <div class="newRegister-addMobileNumber">
            <div class="newRegister-formBox">
                <div class="formElement newRegister-input">
                    <input id="@userNameInputId" type="text" name="EmailOrPhoneNumber" class="form-control persianDigitInput" placeholder="تلفن همراه" >

                </div>
                <div class="newRegister-button">
                    <button type="submit" class="animateBtn greenAnimateBtn">
                        <i class="fa fa-check"></i>
                        send
                        </button>
</div>
            </div>
        </div>
    </form>

下面是我JavaScript代码：

loadValidation: function (classId) {
//I suspect that this part is not reading the url correctly
        var currentUrl = window.location.href;
        console.log(currentUrl);
        var self = this;
        $(classId)
           .validate({
               rules: {
                   EmailOrPhoneNumber: {
                       required: true,
                       regex: $utils.regex.EmailOrPhoneNumber
                   },
                   Password: {
                       required: true
                   }
               },
               messages: {
                   EmailOrPhoneNumber: {
                       required: $utils.messages.user.required_EmailOrPhoneNumber,
                       regex: $utils.messages.other.notValid_EmailPhoneNumberFormat
                   },
                   Password: {
                       required: $utils.messages.user.required_Password
                   }
               },
               submitHandler: function (form) {
                   var $form = $(form);
                   var validator = $form.data("validator");
                   if (self.requireCaptcha(classId)) {
                       var captcha = $(classId + " input[name='CaptchaImage']").val();
                       if (captcha.length <= 0) {
                           validator.showErrors({
                               CaptchaImage: $utils.messages.other.requreid_CaptchaImage
                           });
                           return;
                       }
                   }
                   if (!validator || !$form.valid())
                       return;
                   $("#returnUrl").val($("#returnUrl").val() + window.location.hash);
                   $.ajax({
                       url: "/Account/Login",
                       datatype: "json",
                       type: "POST",
// this is the part where the input should be appended to the form
                       addurl: function () {
                           if ( currentUrl == "http://localhost:59746/Account/Register/") {
                               console.log(currentUrl)
                               $('<input />').attr('type', 'hidden')
                                   .attr('name', "ReturnUrl")
                               .attr('value', "regurl")
                                   .appendTo(".basketForm.loginForm");}

      },

有什么想法为什么它不工作吗？我也试过删除. between basketForm.loginForm并用空格替换它，但它也不工作

backbone.js

来源：https://stackoverflow.com/questions/55156703/appending-an-input-to-a-html-form-with-jquery-not-working

2条答案

按热度按时间

vx6bjr1n1#

您的程式码几乎没有问题。
$.ajax上没有addurl方法，这就是为什么表单域没有被追加到DOM（请参考$.ajax API）。$.ajax API上有一个beforeSend方法，但是它被用来在发送jqXHR对象之前修改它。
方法loadValidation的参数名应该是formClass或formId，因为classId没有意义，请正确格式化您的代码，它现在看起来真的很糟糕。
您可以在发送 AJAX 请求之前将字段追加到表单中。
以下是在将数据发送到服务器之前附加表单字段的小技巧：
工作JSFIDDLE

赞(0）回复(0）举报 2022-11-10

kiayqfof2#

您可以在发送到服务器之前序列化输入值，并将任何其他参数附加到它，如下所示

// serialize all inputs inside .loginForm
var formData = $('.loginForm :input').serializeArray();
// add other data when on specific address
if (currentUrl == "http://localhost:59746/Account/Register/") {
  formData.push({ name: "ReturnUrl", value: "regurl" });
}

// post with formData
$.post('/Account/Login',formData,function(responseData){
  // do something here with responseData
},'json');

**EDIT：**从您的代码上下文中，尝试使用上面的脚本更改下面显示的 AJAX 请求行

$.ajax({
                       url: "/Account/Login",
                       datatype: "json",
                       type: "POST",
// this is the part where the input should be appended to the form
                       addurl: function () {
                           if ( currentUrl == "http://localhost:59746/Account/Register/") {
                               console.log(currentUrl)
                               $('<input />').attr('type', 'hidden')
                                   .attr('name', "ReturnUrl")
                               .attr('value', "regurl")
                                   .appendTo(".basketForm.loginForm");}
})

赞(0）回复(0）举报 2022-11-10

我来回答

backbone.js 在JQuery不工作的情况下将输入追加到HTML表单

2条答案

相关问题

热门标签

最新问答