JavaScriptでXML文字列をHTMLフォームに変換する

Question

Javascript/jQueryを使用してXML文字列からHTMLフォームを作成する必要があります。

私は以下の回答

XML to Form

を通じてこれについての回答交渉に来た - XML to Form generator

私が欲しい正確に何ですが、私は提供されたリンク内のJavaScriptコードを見つけることができませんでした。 XML文字列を解析し、ノードを繰り返してフォームを構築しようとしましたが、コードに多数のバグがあり、時間が足りません。以下 は、私が試したコードです：私はXMLからHTMLフォームの構築を支援してください

function xmlToForm(text) { 
    var parser = new DOMParser(); 
    var xmlDoc = parser.parseFromString(text,"text/xml"); 

    var htmlForm = '<form action="">'; 


    var rootNode = xmlDoc.childNodes[0]; 

    htmlForm += nodeToHtmlForm(rootNode); 
    htmlForm += '</form>'; 

    function nodeToHtmlForm (node) { 
     var form = ''; 

     if(node.childNodes.length > 0) { 
      node.childNodes.forEach(function(childNode) { 

      if(childNode.childNodes.length > 0) { 

       if(childNode.firstChild.nodeValue) { 
        form += '<div class="form-group">' 
        form += '<label><h4>'+ childNode.nodeName +'</h4>'+ '</label>'; 
        form += '<input class="" id="id" value=' + childNode.firstChild.nodeValue + '>'; 
        form += '</div>' 
       } else { 

       } 

       form += '<br><h4>'+ childNode.nodeName +'</h4><br>' 

       childNode.childNodes.forEach(function(grandChildNode) { 
        console.log(grandChildNode); 
        form += nodeToHtmlForm(grandChildNode) 
       }); 
      } 

      else { 
       form += '<div class="form-group">' 
       form += '<label>'+node.nodeName+'</label>'; 
       form += '<input class="" id="id" value='+node.firstChild.nodeValue+'>'; 
       form += '</div>' 
      } 

      }); 
     } else { 
       if(node.firstChild) { 
        form += '<div class="form-group">' 
        form += '<label>'+node.nodeName+'</label>'; 
        form += '<input class="" id="id" value='+node.firstChild.nodeValue+'>'; 
        form += '</div>' 
       } else { 
        form += '<br><h4>'+ node.nodeName +'</h4><br>'; 
       } 
      } 

     return form; 
    } 
    return htmlForm; 
    //document.getElementById("htmlForm").innerHTML = htmlForm; 
} 

誰か。

Answer 1

好奇心旺盛な方のため

または私はあなたがjsの中で効率的に行うことができ思ういけないどこか他のソリューション

function xmlToForm(xmlDoc) { 
     var framed_html = ""; 

     xml_to_html($(xmlDoc[0].children[0]));  

     function xml_to_html(xmlDoc) { 
      if (xmlDoc[0].firstElementChild) { 
       framed_html += "<fieldset class='back-fieldset'><legend>" + xmlDoc[0].nodeName + "</legend>"; 
       xml_to_html($(xmlDoc[0].firstElementChild)); 
       framed_html += "</fieldset>"; 
       if (xmlDoc[0].nextElementSibling) { 
        xml_to_html($(xmlDoc[0].nextElementSibling)); 
       } 

      } else { 
       framed_html += "<div class='form-group'><label>" + xmlDoc[0].nodeName + "</label>"; 
       framed_html += "<input type='text' value='"+xmlDoc[0].innerHTML+"'></div>"; 

       if (xmlDoc[0].nextElementSibling) { 
        xml_to_html($(xmlDoc[0].nextElementSibling)); 
       } else { 
        framed_html += "<hr>"; 
       } 
      } 

     } 

     return framed_html; 
    } 

Answer 2

これは間違いなくあなたに役立つでしょう。しかし、jqueryだけで効率的に処理することはできません。

https://github.com/davidmoten/xsd-forms