SHARE
TWEET

Untitled

a guest Mar 20th, 2019 44 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. 'use strict'
  2.  
  3. $(document).ready(function()
  4. {
  5.  
  6.     $.ajax(
  7.     {
  8.         type: "GET",
  9.         url: ".\test.xml",
  10.         //async: false,
  11.         dataType: "xml",
  12.         success: function(xml)
  13.         {
  14.             let idDiv = 0;  
  15.             let idRadio = 0;
  16.  
  17.             $.parseXML(xml);
  18.             $(xml).find('div').each(function()
  19.             {
  20.                 const formDiv = document.createElement("div");
  21.                 formDiv.className = $(this).attr('name');
  22.                 setBorder(formDiv, $(this).find('border').attr('color'), $(this).find('border').attr('style'), $(this).find('border').attr('width'));
  23.                 formDiv.id = setID($(this),[idDiv]);
  24.                 console.log(formDiv.id);
  25.                 setCoordinates(formDiv, $(this).attr("top"), $(this).attr("left"), $(this).attr('width'), $(this).attr('height'));
  26.                 formDiv.style.position = "absolute";
  27.                 $(this).find('radio').each(function()
  28.                 {
  29.                     $(this).find('elem').each(function()
  30.                     {
  31.                         const radioAndLabel = document.createElement("div");
  32.                         const rad = document.createElement('input');
  33.                         const lab = document.createElement("label");
  34.                         rad.setAttribute("type", "radio");
  35.                         rad.setAttribute("value", $(this).text());
  36.                         rad.setAttribute("name", "lewis");
  37.                         rad.id = setID($(this),[idDiv, idRadio]);
  38.                         console.log(rad.id);
  39.                         lab.setAttribute("for", $(this).text());
  40.                         lab.innerHTML = $(this).text();
  41.                         setCoordinates(radioAndLabel, $(this).attr('top'), $(this).attr('left'));
  42.                         radioAndLabel.appendChild(rad);
  43.                         radioAndLabel.appendChild(lab);
  44.                         formDiv.appendChild(radioAndLabel);
  45.                         idRadio++;
  46.                     });
  47.                 });
  48.                 formDiv.appendChild(document.createElement("br"));
  49.                 document.body.appendChild(formDiv);
  50.                 idDiv++;
  51.                 idRadio = 0;
  52.  
  53.             });
  54.         }
  55.     });
  56. });
  57.  
  58. function setCoordinates(elem, top, left, width, height)
  59. {  
  60.     elem.style.position = "relative";
  61.     if (top !== undefined)
  62.     {                  
  63.         elem.style.top = top;
  64.     }
  65.     if (left !== undefined)
  66.     {
  67.         elem.style.left = left;
  68.     }
  69.     if (width !== undefined)
  70.     {                  
  71.          elem.style.width = width;
  72.     }
  73.     if (height !== undefined)
  74.     {
  75.          elem.style.height = height;
  76.     }
  77. }
  78.  
  79. function setID(elem, values)
  80. {
  81.     let IDstring = elem.attr("id");
  82.     for (let i=0; i<values.length; i++)
  83.     {
  84.         IDstring += values[i].toString() + "_";
  85.     }
  86.     IDstring = IDstring.substring(0, IDstring.length - 1);
  87.     return IDstring
  88. }
  89.  
  90. function setBorder(elem, color, style, width)
  91. {
  92.         elem.style.border = color + " " + style + " " + width;
  93. }
  94.      
  95. <form>
  96.     <div id="div_" name="div_" top="150px" left="150px" height="125px" width="310px">
  97.         <border style="solid" width="3px" color="red"></border>
  98.         <radio>
  99.             <elem id="radio_">cercle</elem>
  100.             <elem id="radio_" top="-20px" left="100px">carrĂ©</elem>
  101.             <elem id="radio_" top="-20px">triangle</elem>
  102.             <elem id="radio_" top="-40px" left="100px">rectangle</elem>
  103.         </radio>
  104.     </div>
  105.     <div id="div_" name="div_" width="180px" height="45px">
  106.     <border style="solid" width="3px" color="green"></border>
  107.         <radio>
  108.             <elem id="radio_">AAAA</elem>
  109.             <elem id="radio_" top="-20px" left="100px">BBBB</elem>
  110.             <elem id="radio_" top="-20px">CCCC</elem>
  111.             <elem id="radio_" top="-40px" left="100px">DDDD</elem>
  112.         </radio>
  113.     </div>
  114. </form>
  115.      
  116. <form>
  117.     <div id="div_" name="div_" top="150px" left="150px" height="125px" width="310px">
  118.         <border style="solid" width="3px" color="red"></border>
  119.         <radio>
  120.             <elem id="radio_">cercle</elem>
  121.             <elem id="radio_" top="-20px" left="100px">carrĂ©</elem>
  122.             <elem id="radio_" top="-20px">triangle</elem>
  123.             <elem id="radio_" top="-40px" left="100px">rectangle</elem>
  124.         </radio>
  125.         <div id="div_" name="div_" width="180px" height="45px">
  126.         <border style="solid" width="3px" color="green"></border>
  127.             <radio>
  128.                 <elem id="radio_">AAAA</elem>
  129.                 <elem id="radio_" top="-20px" left="100px">BBBB</elem>
  130.                 <elem id="radio_" top="-20px">CCCC</elem>
  131.                 <elem id="radio_" top="-40px" left="100px">DDDD</elem>
  132.             </radio>
  133.         </div>
  134.     </div>
  135. </form>
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top