Jquery로 입력 선택 값을 여러 선택 기준에서 변수에 전달하는 방법

Question

다중 선택 블록이있는이 양식을 클릭 할 때 각 블록 기준의 값을 가져 오려고합니다. 데이터베이스,하지만 블록을 클릭 할 때마다 내 스크립트는 모든 아이디어의 가치를 얻고 있습니까?

내가 여기 jsFiddle을 만들어 : http://jsfiddle.net/creativestudio/Hqbmk/4/

<form action="" method="post" id="postingFeedback"> 

      <!-- .votes-list --> 
      <ul class="vote-list"> 
       <li class="vote" name="vote1" value="A-value1"> 
       </li> 
       <li class="vote" name="vote1" value="A-value2"> 
       </li> 
       <li class="vote" name="vote1" value="A-value3"> 
       </li> 
       <li class="vote" name="vote1" value="A-value4"> 
       </li> 
       <input name="smileVote" class="is-hidden" data-role="none" value="" /> 
      </ul><!--/.votes-list --> 

<div class="clear"></div> 

      <!-- .votes-list --> 
      <ul class="vote-list"> 
       <li class="vote" name="vote2" value="B-value1"> 
       </li> 
       <li class="vote" name="vote2" value="B-value2"> 
       </li> 
       <li class="vote" name="vote2" value="B-value3"> 
       </li> 
       <li class="vote" name="vote2" value="B-value4"> 
       </li> 
       <input name="smileVote" class="is-hidden" data-role="none" value="" /> 
      </ul><!--/.votes-list --> 
      <div class="clear"></div> 

<div class="clear"></div> 

      <!-- .votes-list --> 
      <ul class="vote-list"> 
       <li class="vote" name="vote3" value="C-value1"> 
       </li> 
       <li class="vote" name="vote3" value="C-value2"> 
       </li> 
       <li class="vote" name="vote3" value="C-value3"> 
       </li> 
       <li class="vote" name="vote3" value="C-value4"> 
       </li> 
       <input name="smileVote" class="is-hidden" data-role="none" value="" /> 
      </ul><!--/.votes-list --> 
      <div class="clear"></div> 

<div class="clear"></div> 

      <!-- .votes-list --> 
      <ul class="vote-list"> 
       <li class="vote" name="vote3" value="D-value1"> 
       </li> 
       <li class="vote" name="vote3" value="D-value2"> 
       </li> 
       <li class="vote" name="vote3" value="D-value3"> 
       </li> 
       <li class="vote" name="vote3" value="D-value4"> 
       </li> 
       <input name="smileVote" class="is-hidden" data-role="none" value="" /> 
      </ul><!--/.votes-list --> 
      <div class="clear"></div> 

<div class="clear"></div> 

      <!-- .votes-list --> 
      <ul class="vote-list"> 
       <li class="vote" name="vote4" value="D-value1"> 
       </li> 
       <li class="vote" name="vote4" value="D-value2"> 
       </li> 
       <li class="vote" name="vote4" value="D-value3"> 
       </li> 
       <li class="vote" name="vote4" value="D-value4"> 
       </li> 
       <input name="smileVote" class="is-hidden" data-role="none" value="" /> 
      </ul><!--/.votes-list --> 
      <div class="clear"></div> 

<div class="clear"></div> 

      <!-- .votes-list --> 
      <ul class="vote-list"> 
        <li class="vote" name="vote5" value="E-value1"> 
       </li> 
       <li class="vote" name="vote5" value="E-value2"> 
       </li> 
       <li class="vote" name="vote5" value="E-value3"> 
       </li> 
       <li class="vote" name="vote5" value="E-value4"> 
       </li> 
       <input name="smileVote" class="is-hidden" data-role="none" value="" /> 
      </ul><!--/.votes-list --> 
      <div class="clear"></div> 

</form> 

여기

내 JS :

function getValues(){  
    $('#postingFeedback li').on('click', function(event){   
      var $clickedValue = $(this).val($(this).attr("value")); // Retreive "value" 
      $(this).siblings('input[name="smileVote"]').val($clickedValue); // Plug smile value into input for database POSTS 
    }); 
} 



getValues(); 
​ 

Answer 1

value 의도 아니에요, 예약 된 속성입니다 데이터베이스로 전송하는 VAR를 사용하여 시도 당신이하려고하는 것처럼 li에서 사용되었습니다. vote처럼, 뭔가 다른 그 이름을 바꿉니다

<li class="vote" name="vote1" vote="A-value1"> 

가 그런 가치를 직접 속성에 액세스하여 :

$('#postingFeedback li').on('click', function(event){ 
    $(this).siblings('input[name="smileVote"]').val($(this).attr('vote')); 

Answer 2

각 입력에 다른 이름을 지정합니다. 양식은 이름을 키로하는 키 값 쌍으로 데이터를 보냅니다. 모든 입력 상자는 동일한 이름을 가지므로 하나의 키 값 쌍만됩니다.

Answer 3

.serializeArray()

$('[type="submit"]').on('click' , function(e) { 

    e.preventDefault(); 

    var a = $(':input').serializeArray().get(); 
    console.log(a); 
}); 

당신은

Check Fiddle