Получить значение формы в формате JSON на кнопке мыши

Question

я пытаюсь получить значение формы в формате JSON на кнопке мыши код ..

$('#submit').click(function() { 
    var form = $("#user_info"); 
    var data =form.serialize(); 
    console.log(data) 

, но я получаю значение как

userfnmae=xyz&userlname=xyz&useremail=a@b.com&useremail= xyz&usercity=zzz&userlocation=abc&userproduct=xyz&usercomment=xyz 

но я хочу данные в формате json.

Answer 1

Используйте эту кодировку ...

$('#submit').click(function() { 
    var result= {}; 
    $("#user_info").serializeArray().map(function(item) { 
     if (result[item.name]) { 
      if (typeof(result[item.name]) === "string") { 
       result[item.name] = [config[item.name]]; 
      } 
      result[item.name].push(item.value); 
     } else { 
      result[item.name] = item.value; 
     } 
    }); 
console.log(result); 
}); 

Answer 2

Применение serializeArray =>Закодировать набор элементов формы как массив имен и значения

Попробуйте это:

$('#g').click(function(e) { 
 
    e.preventDefault(); 
 
    var data = $('#user_info').serializeArray(); 
 
    alert(JSON.stringify(data)); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<form id='user_info'> 
 
    <div> 
 
    <input type="text" name="a" value="1" id="a"> 
 
    </div> 
 
    <div> 
 
    <input type="text" name="b" value="2" id="b"> 
 
    </div> 
 
    <div> 
 
    <input type="hidden" name="c" value="3" id="c"> 
 
    </div> 
 
    <div> 
 
    <textarea name="d" rows="8" cols="40">4</textarea> 
 
    </div> 
 
    <div> 
 
    <select name="e"> 
 
     <option value="5" selected="selected">5</option> 
 
     <option value="6">6</option> 
 
     <option value="7">7</option> 
 
    </select> 
 
    </div> 
 
    <div> 
 
    <input type="checkbox" name="f" value="8" id="f"> 
 
    </div> 
 
    <div> 
 
    <input type="submit" name="g" value="Submit" id="g"> 
 
    </div> 
 
</form>