2017-03-09 7 views
1

隠された要素をフォームのシリアライゼーションから除外する方法を見つけるのが焦燥しています。隠しフォーム要素を除外してシリアライズを行う方法

私はこのコードを使用してみました:

$("#form-user :not(.hide_element) > :input").serialize(); 

か、この1:

$("#form-user").not(".hide_element > input").serialize(); 

をまだ私は私の内部のフォームを入れている同じフォームデータ応答

を得ましたモーダル。

<div class="modal-body"> 
     <?php echo form_open('#',array("class"=>"form-horizontal","id"=>"form-user")); ?> 
     <div id="message"></div> 
      <div class="form-group"> 
       <label class="control-label col-md-3">Username:</label> 
       <div class="col-md-9"> 
       <input type="text" name="uname" class="form-control"> 
       </div> 
      </div> 
      <div class="form-group hide_element" > 
       <label class="control-label col-md-3" id='lblpass'>Password:</label> 
       <div class="col-md-9"> 
       <input type="password" name="pass" class="form-control"> 
       </div> 
      </div> 
      <div class="form-group hide_element"> 
       <label class="control-label col-md-3" id='lblnewpass'>Confirm Password:</label> 
       <div class="col-md-9"> 
       <input type="password" name="confirmpass" class="form-control"> 
       </div> 
      </div> 
      <div class="form-group"> 
       <label class="control-label col-md-3">Email Address:</label> 
       <div class="col-md-9"> 
       <input type="email" name="email" class="form-control"> 
       </div> 
      </div> 
      <div class="form-group"> 
       <label class="control-label col-md-3">User Status:</label> 
       <div class="col-md-9"> 
       <select name="userstatus" class="form-control"> 
       <option hidden>Select user status of the account (Default = Active)</option> 
       <option value="1">Active</option> 
       <option value="2">Inactive</option> 
       </select> 
       </div> 
      </div> 
      <div class="form-group"> 
       <label class="control-label col-md-3">User Type:</label> 
       <div class="col-md-9"> 
       <select name="usertype" class="form-control"> 
       <option hidden>Select user type of the account (Default = Customer)</option> 
       <option value=1>Customer</option> 
       <option value=2>Admin</option> 
       </select> 
       </div> 
      </div> 
     <div class="modal-footer"> 
      <button class="btn btn-success" type="button" id="action"><i class="fa fa-save"></i> Add user</button> 
      <button class="btn btn-danger" type="button" data-dismiss="modal"><i class="fa fa-close"></i> Close</button> 
     <?php echo form_close(); ?> 

私のAJAX機能:

$(document).ready(function(){ 
$('#form-user').on('click','#action',function(e){ 
    e.preventDefault(); 
    if(action == 'add'){ 
    $.ajax({ 
     url: site_url('User/add_user'), 
     data: $("#form-user :not(.working) > input").serialize(), 
     type:'POST', 
     encode: true, 
     dataType:'json', 
     success:function(data){ 
      if(!data.success){ 
       if(data.errors){ 
        $('#message').html(data.errors).addClass('alert alert-danger'); 
       } 
      }else{ 
       $('#message').html("").removeClass('alert alert-danger'); 
       $('.modal-title').html('Processing request'); 
       $('#alert').modal('show'); 
       $('#mymodal').modal('hide');     
       $('#body-message').html("<i class='fa fa-spinner fa-pulse fa-3x fa-fw'></i> Updating..."); 
       setTimeout(function(){ 
        $('#body-message').html("<i class='fa fa-check fa-3x'></i>"+ data.message); 
       },3000) 
       setTimeout(function(){ 

        $('#alert').modal('hide'); 
        $('#form-user')[0].reset(); 
        reloadData(); 
       },5000); 
      } 

     } 
    }); 
    }else{ 
     $.ajax({ 
     url: site_url('User/update_user'), 
     data: $("#form-user :not(.working) > :input").serialize() +"&id=" + id, 
     type:'POST', 
     encode: true, 
     dataType:'json', 
     success:function(data){ 
      if(!data.success){ 
       if(data.errors){ 
        $('#message').html(data.errors).addClass('alert alert-danger'); 
       } 
      }else{ 
       $('#message').html("").removeClass('alert alert-danger'); 
       $('.modal-title').html('Processing request'); 
       $('#alert').modal('show'); 
       $('#mymodal').modal('hide');     
       $('#body-message').html("<i class='fa fa-spinner fa-pulse fa-3x fa-fw'></i> Updating..."); 
       setTimeout(function(){ 
        $('#body-message').html("<i class='fa fa-check fa-3x'></i>"+ data.message); 
       },3000) 
       setTimeout(function(){ 

        $('#alert').modal('hide'); 
        $('#form-user')[0].reset(); 
        reloadData(); 
       },5000); 
      } 

     } 
    }); 
    } 
}); 
}); 
+0

'$(「#フォーム・ユーザー」)を試してみてください(「入力:目に見える」)を見つける(シリアライズ);' – yomisimie

+0

だけでなく、それは何とか。 2つの可視要素を除外します(両方ともドロップダウン選択タグです)。 –

+0

jqueryクエリは単なるCSSクエリであるため、 '$("#form-user ")のように' select'を追加できるはずです。 ( "input:visible、select:visible")。serialize(); ' - これが役に立ったら... – Gunnar

答えて

0

無効化された要素が掲示やシリアライズされません、あなたは一時的に追加することができますので、 disabledの属性彼ら、そして成功し、応答後に以前の状態への復元:

$('#form-user').on('click','#action',function(e){ 
    $("#form-user .hide_element > input").attr('disabled','disabled'); 
    $.ajax({ 
    ... 
    data: $("#form-user").serialize(), 
    success:function() { 
     $("#form-user .hide_element > input").removeAttr('disabled'); 
    } 
    }); 
}); 
+0

の代わりに取得しましたが、答えはうまくいかず、入力タグのdisabledプロパティを使って考えてください。私はすでにそれを解決した –

+0

あなたが問題を解決することができてうれしい – amenadiel

0

はこれを試してみてください:

var frm = $('#finalform').find(":input:not(:hidden)").serialize(); 

それとも

var frm = $('#finalform :input:not(:hidden)').serialize(); 
+0

は動作しません。私はフォームのデータをすべて –

関連する問題