jquery傳遞值到單選按鈕

我用jquery ajax代碼來運行搜索功能。jquery傳遞值到單選按鈕

，這裏是我的ajax至今：

$('button[type="search"]').click(function(e) { 
$.ajax({ 
    url: "{{ route('fine.search') }}", 
    type: "POST", 
    data: { 
     '_token' : '{{csrf_token() }}', 
     'driver_id' : $('select[name="driver_id"]').val(), 
     'fine_date' : $('input[name="fine_date"]').val(), 
    }, 
    success: function(data) { 
     if(data.status == true) { 
     var result= $('#search-result'); 

     $.each(data.getCarbyDriver, function(i, data) { 
     PlateEle = $('<input/>').attr({ type: 'radio', name:'rad'}); 
        $("#search-result").html(data.plate_no); 
     StartEle = $('<div />').html(data.start_time); 
     EndEle = $('<div />').html(data.end_time); 
     }); 
     $('#search-result').append(PlateEle, StartEle, EndEle); 
     } 
    }, 
    error: function(data) { 

    } 
}); 
});

和返回的數據像這樣我的網絡（inpect元）上：

car_id:5 
driver_id:1 
end_time:"2016-11-16 18:00:00" 
plate_no:"DFE82846J" 
start_time:"2016-11-16 08:00:00" 
working_date:"2016-11-16 00:00:00"

這裏是到目前爲止的形式刀片代碼：

<div class="row top"> 
<div class="col-xs-4 col-sm-4 col-md-4"> 
    <div class="form-group"> 
     <label class="control-label">Driver Name:</label> 
     {!! Form::select('driver_id', $driver, null, array('class' => 'form-control')) !!} 
    </div> 
</div> 

<div class="col-xs-4 col-sm-4 col-md-4"> 
    <div class="form-group"> 
     <label>Fine Date:</label> 
     {!! Form::text('fine_date', null, array('id' => 'datetimepicker', 'class' => 'form-control')) !!} 
    </div> 
</div> 

<div class="col-xs-4 col-sm-4 col-md-4"> 
    <div class="form-group filter-btn"> 
     <button class='btn btn-info' type='search'>Search</button> 
    </div> 
</div> 
</div> 

<div class="row mid "> 
<div class="col-xs-4 col-sm-4 col-md-4"> 
    <div id="search-result"></div> 
</div> 
</div>

問題是我無法保存。它會拋出錯誤car_id'不能爲空'。

我如何通過car_id到我的電臺，所以一旦我的單選按鈕，點擊它節省plate_no

IM使用laravel car_id 5.3

來源

2016-11-21 Andrew Vanusi

你的ajax調用在哪裏有'car_id'？ –

@SandrinaPereira多數民衆贊成我的問，如何將car_id傳遞給電臺？ –

但你想保存car_id在哪裏？在無線電價值？在阿賈克斯呼叫（數據）我不理解你的問題... –

這我不清楚，你已經PlateEle，StartEle和EndEle定義。這些全局變量是在JavaScript的其他地方定義的嗎？

無論哪種方式，據我所知，car_id是由ajax POST返回，所以它的數據var返回到您的成功函數？

如果你想設置你動態地創建無線電元素的值，我認爲這將是這樣的：

PlateEle = $('<input/>').attr({ type: 'radio', name:'rad'}).val(data.car_id);

這是我嘲笑了一個例子。我正在創建一個數據對象，就像我認爲你正在返回的數據對象一樣。當我加載這個頁面時，我收到了一個無線電輸入。這對你有用嗎？

<html> 
<head> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script> 
    <script type="text/javascript"> 
    $(document).ready(function(){ 
     var result= $('#search-result'); 

     //mocking up what I assume your data object looks like 
     var data = {}; 
     data.car_id=5; 
     data.driver_id=1; 
     data.end_time="2016-11-16 18:00:00"; 
     data.plate_no="DFE82846J"; 
     data.start_time="2016-11-16 08:00:00"; 
     data.working_date="2016-11-16 00:00:00"; 


     PlateEle = $('<input/>').attr({ type: 'radio', name:'rad'}).val(data.car_id); 
     console.log(PlateEle); 
     $("#search-result").html(data.plate_no); 
     StartEle = $('<div />').html(data.start_time); 
     EndEle = $('<div />').html(data.end_time); 
     $('#search-result').append(PlateEle, StartEle, EndEle); 
    }); 
</script> 
</head> 
<body> 
    <div id="search-result"></div> 
</body> 
</html>

來源

2016-11-21 14:19:45

，它不是全局變量。即時通訊使用jQuery創建廣播。我需要我的收音機中的car_id來保存它。 btw仍然無法正常工作。 –

如果這不起作用，您可以嘗試並用這種方式構建輸入： –

$（'input [type =「radio」] [name =「rad」] [value =''+ data.car_id +'「]'） –

，以節省您輸入電臺的價值，這可能應該使絕招：

$.ajax({ 
    url: "{{ route('fine.search') }}", 
    type: "POST", 
    data: { 
     '_token' : '{{csrf_token() }}', 
     'driver_id' : $('select[name="driver_id"]').val(), 
     'fine_date' : $('input[name="fine_date"]').val(), 
    }, 
    success: function(data) { 
     if(data.status == true) { 
     var result= $('#search-result'); 

     $.each(data.getCarbyDriver, function(i, data) { 
     PlateEle = $('<input type="radio" name="rad" val="'+data.car_id+'">'+data.car_id+'</input>'); 
        $("#search-result").html(data.plate_no); 
     StartEle = $('<div />').html(data.start_time); 
     EndEle = $('<div />').html(data.end_time); 
     }); 
     $('#search-result').append(PlateEle, StartEle, EndEle); 
     } 
    }, 
    error: function(data) { 

    } 
});

來源

2016-11-21 14:39:12

我試過了，沒有工作。 –

什麼問題？有沒有錯誤？ –

在larave日誌中拋出：完整性約束違規：1048在'追加'$（'＃search-result'）之前，您可以通過成功的方式進行console.log（data.car_id）操作，在' –

好，添加或更改單選按鈕的值是簡單的。對於數據庫中的ID，您還可以在單選按鈕上使用一些data- *屬性。但請記住，如果表單是在瀏覽器中提交的，則表單元素上的data *不會發送到服務器。欲瞭解更多詳情，請參閱我下面的工作代碼示例：

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Test Radio Button</title> 

    <script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.min.js"></script> 
    <script type="text/javascript"> 
     var $rdBtn = null; 
     var $txtReader = null; 
     var $txtRdBtnValueReader = null; 
     function doReady() { 
      $rdBtn = $("#myRdBtn"); 
      $txtReader = $("#txtDataReader"); 
      $txtRdBtnValueReader = $("#txtRdBtnValueReader"); 
      $("#btnSetValue") 
        .click(function() { 
         // note the jQuery .val("some text") issue at this point. You will need .attr("value") for setting 
         // .val() is just helpful for reading the current value! 
         $rdBtn.attr("value", "my new value"); 
         $txtRdBtnValueReader.attr("value", $rdBtn.val()); 
        }); 
      $("#btnSetDataValue") 
        .click(function() { 
         $rdBtn.data("mykey", "myval"); 
         $txtReader.attr("value", $rdBtn.data("mykey")); 
        }); 
     } 
     $(document).ready(doReady); 
    </script> 
</head> 
<body> 
    <button type="button" id="btnSetValue">set Value</button> 
    <button type="button" id="btnSetDataValue">set data-* value</button> 
    <div id="myRadioButtonWrapper"> 
     <label for="myRdBtn">your value choice</label> 
     <input type="radio" id="myRdBtn" name="myRdBtn" value="to be replaced" /> 
     <br /> 
     <label for="txtRdBtnValueReader">radio value</label> 
     <input type="text" id="txtRdBtnValueReader" name="txtRdBtnValueReader" readonly /> 
     <br /> 
     <label for="txtDataReader">data-mykey value</label> 
     <input type="text" id="txtDataReader" name="txtDataReader" readonly /> 
    </div> 
</body> 
</html>

這也是一個常見的方式，如果你需要分配給輸入字段連載其作爲JSON價值更多的數據。所以，你可以有一個完整的對象發送到服務器。在PHP中很容易解析。也許這也可以幫助你。祝你好運！

來源

2016-11-21 15:46:37 alpham8

jquery傳遞值到單選按鈕

回答

相關問題