2016-06-14 1 views
-1

Я хочу преобразовать HTML-форму в объект JSON. Форма состоит из двух разделов: Header и Detail. Раздел Header содержит некоторые поля ввода HTML, а раздел Detail - таблица. Фиктивный взгляд на мою форму выглядит следующим образом.Преобразование формы HTML в объект JSON

<!DOCTYPE html> 
 
<html lang="en"> 
 
<body> 
 
\t <form id="MyForm" method="POST"> 
 
\t <div name="HeaderData"> 
 
\t \t <label id="lblFname">First Name:</label> 
 
\t \t <input type="text" name="fname"/> <br/> 
 
\t \t <label id="lblLname">Last Name:</label> 
 
\t \t <input type="text" name="lname" /> <br/> 
 
\t \t <label id="lblEmail">Email:</label> 
 
\t \t <input type="text" name="email" /> <br/> 
 
\t </div> 
 
\t <div id="DetailData"> 
 
\t \t <table cellspacing="0" align="Center" rules="all" border="1" id="MyTable" style="width:940px;border-collapse:collapse;"> 
 
\t \t \t </thead> \t \t 
 
\t \t \t \t \t <th scope="col">Code</th> 
 
\t \t \t \t \t <th scope="col">Name</th> 
 
\t \t \t \t \t <th scope="col">Continent</th> 
 
\t \t \t \t \t <th scope="col">Region</th> 
 
\t \t \t \t \t <th scope="col">Population</th> 
 
\t \t \t \t \t <th scope="col">Independence Year</th> 
 
\t \t \t </thead> 
 
\t \t \t <tbody> 
 
\t \t \t \t <tr> 
 
\t \t \t \t \t <td name="Code">Ind</td> 
 
\t \t \t \t \t <td name="Country">India</td> 
 
\t \t \t \t \t <td name="Continent">Asia</td> 
 
\t \t \t \t \t <td name="Region">Asia</td> 
 
\t \t \t \t \t <td name="Population">113Core</td> 
 
\t \t \t \t \t <td name="Independence">1947</td> 
 
\t \t \t \t </tr> 
 
\t \t \t \t <tr> 
 
\t \t \t \t \t <td name="Code">Ind</td> 
 
\t \t \t \t \t <td name="Country">India</td> 
 
\t \t \t \t \t <td name="Continent">Asia</td> 
 
\t \t \t \t \t <td name="Region">Asia</td> 
 
\t \t \t \t \t <td name="Population">1500000</td> 
 
\t \t \t \t \t <td name="Independence">1947</td> 
 
\t \t \t \t </tr> 
 
\t \t \t </tbody> 
 
\t \t </table> 
 
\t </div> 
 
</body> 
 
</form> 
 
</html>

Я бы ожидать, что полученный объект JSON, чтобы имитировать:

{"HeaderData":[{"Fname":"XYZ","LName":"ABC","Email":"[email protected]"}], 
 
"DetailData":[{"Code":"Ind","Name":"India","Continent":"Asia","Region":"Asia","Population":"113 Crore","Independence Year":"1947"}], 
 
"DetailData":[{"Code":"Ind","Name":"India","Continent":"Asia","Region":"Asia","Population":"113 Crore","Independence Year":"1947"}] 
 
}

Я пробовал разные библиотеки, как jquery.tabletojson.js, но они не может назначать массивы отдельным переменным.

Позже я хочу преобразовать этот объект JSON в строку XML, чтобы обработать его в SQL Server QUERY. Я бы ожидать, что XML-строки для имитации:

enter code here 
 
<Root> 
 
\t <HeaderData> 
 
\t \t <FName>XYZ</FName> 
 
\t \t <LName>XYZ</LName> 
 
\t \t <Email>[email protected]</Email> 
 
\t </HeaderData> 
 
\t <DetailData> 
 
\t \t <Code>Ind</Code> 
 
\t \t <Name>India</Name> 
 
\t \t <Continent>Asia</Continent> 
 
\t \t <Region>Asia</Region> 
 
\t \t <Population>113Crore</Population> 
 
\t \t <IndependenceYear>1947</IndependenceYear> 
 
\t </DetailData> 
 
\t <DetailData> 
 
\t \t <Code>Ind</Code> 
 
\t \t <Name>India</Name> 
 
\t \t <Continent>Asia</Continent> 
 
     <Region>Asia</Region> 
 
\t \t <Population>113Crore</Population> 
 
\t \t <IndependenceYear>1947</IndependenceYear> 
 
\t </DetailData> 
 
</Root>

Мой текущий приоритет строит STRING JSON. Я могу преобразовать данные в XML, когда JSON доступен.

+1

Ваш пример json не имеет смысла. у вас есть несколько элементов с тем же именем. это не так, как работает json. –

+0

Не должны ли узлы 'DetailData' в XML быть обернуты в родительский узел? ('DetailDatas' или что-то в этом роде) – David

+0

Возможно, вы решили ограничить свой вопрос JSON. Тот факт, что вы хотите преобразовать JSON в XML, является сверхъестественным для вашего фактического вопроса. Ваш вопрос будет легче читать. –

ответ

0

Если все ваши <td> 'метки имеют имя приписывать, то вы можете преобразовать его в объект JSON с несколькими строками JQuery ...

var poop = []; 
$("#MyTable").find("tr").each(function(){ 
    var fart = {}; 
    if(!$(this).find("td").length) return; 
    $(this).find("td").each(function(){ 
     fart[$(this).attr("name")]=$(this).text(); 
    }); 
    poop.push(fart); 
}); 

console.log(poop); 

Вот рабочий пример: fiddle.

+0

Кто бы ни пытался отредактировать ответ, прочитайте этот вопрос перед тем, как отредактировать ответы людей. этот ответ не имеет абсолютно никакого отношения к форме. –

+0

Привет, Pootie, я попробовал вариант, который вы предоставили. Но это не плодотворно. Он возвращает объект json и массивы. но я хочу, чтобы массивы в переменных –