javascript or jquery: convert html element id to xml

I am seeking help on how to automate the creation of Item 2 below from html similar to Item 1

The patter is as follows
form.id = table.id
input.id (first of three sections separated by '_' = row id
   Only one rowid is needed
input.id (second of three sections separated by '_' = property id
  One property node per input.id
  Nested inside row id




Item 1: sample html
<html>
<form id="HRPANFRM">
<input id="headerin_trantype_1">
<input id="headerin_trandexc_1"/>
<select id="Requestor"/>
</form
</html>

Item 2: sample output:
<table id="HRPANFRM" object="Webform">
<row id="headerin">
      <property id="trantype"/>
      <property id="trandesc"/>
</row>
<row id="sectionA">
      <property id="lastname"/>
      <property id="firstnam"/>
      <property id="middlein"/>
      <property id="employid"/>
      <property id="socialse"/>
      <property id="formname"/>
      <property id="salutatn"/>  
      <property id="suffixin"/>
</row>
<row id="sectionB">
      <property id="streetaa"/>
      <property id="cityname"/>
      <property id="countyin"/>
      <property id="statecod"/>
      <property id="zipcodei"/>
      <property id="zipcodep"/>
      <property id="homephmn"/>
      <property id="cellphpr"/>
      <property id="peremail"/>
      <property id="dtbirthm"/>
      <property id="workphac"/>
      <property id="workphmn"/>
      <property id="dthireim"/>
      <property id="dtprobem"/>
</row>
<row id="sectionC">
      <property id="dteffcim"/>
      <property id="deptinfo"/>
      <property id="divinfor"/>
      <property id="workloca"/>
      <property id="checkdis"/>
      <property id="position"/>
      <property id="paysched"/>
      <property id="hourrate"/>
      <property id="newannua"/>
      <property id="fteinfor"/>
      <property id="statusin"/>
      <property id="incuname"/>
      <property id="incuidin"/>
      <property id="effcatem"/>
      <property id="effcated"/>
      <property id="effcatey"/>
</row>
<row id="sectionD">
      <property id="effcatem"/>
      <property id="newdepti"/>
      <property id="newdivis"/>
      <property id="newwkloc"/>
      <property id="newckdis"/>
      <property id="newposit"/>
      <property id="newpaysc"/>
      <property id="newhourl"/>
      <property id="newsalar"/>
      <property id="newftein"/>
      <property id="newstatu"/>
      <property id="incumnam"/>
      <property id="incumidi"/>
      <property id="currsche"/>
      <property id="currtitl"/>
      <property id="currposi"/>
</row>
<row id="sectionE">
      <property id="startdat"/>
      <property id="antenddt"/>
      <property id="actretdt"/>
</row>
<row id="sectionF">
      <property id="dtresigm"/>
      <property id="dtretirm"/>
      <property id="dttermim"/>
</row>
<row id="sectionG">
      <property id="deptcode"/>
      <property id="accounti"/>
      <property id="percenti"/>
      <property id="percttli"/>
</row>
<row id="sectionH">
      <property id="deptnote"/>
</row>
<row id="sectionI">
      <property id="retropay"/>
      <property id="hrnotesi"/>
</row>
<row id="sectionJ">
      <property id="deptdivi"/>
      <property id="posittle"/>
      <property id="ptfttime"/>
      <property id="minsched"/>
      <property id="minsalar"/>
      <property id="minhourl"/>
      <property id="maxsched"/>
      <property id="maxsalar"/>
      <property id="maxhourl"/>
      <property id="dtavailim"/>
      <property id="formincu"/>
      <property id="reasonch"/>
      <property id="reasonin"/>
      <property id="reasonin"/>
</row>
<row id="hiddenin">
      <property id="curracti"/>
      <property id="HRunqkey"/>
      <property id="PYunqkey"/>
</div>

</row>
<property id="Requestor"/>
<property id="Connection"/>
<property id="ExtState"/>
</table>
KeithMcElroyAsked:
Who is Participating?
 
Julian HansenCommented:
Not sure I understand this one
put non separated inputs into
property node after all the rows.

Is there a way to include selects as well?
Yes
change line 22 from
  $('input').each(function() {

Open in new window

To
  $('input,select').each(function() {

Open in new window

0
 
Julian HansenCommented:
Not clear on what your input is - can't see a direct relation ship between item 1 and item 2 - can you explain a bit more.
0
 
KeithMcElroyAuthor Commented:
sorry about that.  

The html document will have one of two types of ids in each element
Type 1:  a straight id   such as  id="Requestor"
Type 2:  a parsed or delimited id such as  "rowname_fieldnam_1"

I am trying to gain a jquery or javascript that will gather all of the elements and do the following:

1. Organize each Type 2 element under a row node something like this


<row id="rowname">
    <property id="fieldnameA"/>
</row>

Anticipate that there will be multi elements with the same rowid in its id

Ex
<input id="rowname_fieldnameA_1">
<input id="rowname_fieldnameB_1">

that shall result in

<row id="rowname">
    <property id="fieldnameA"/>
    <property id="fieldnameB"/>
</row>


2.  wrap the row nodes with  a table node named after the form id

<table id="formid">
    <row id="rownameA">
        <property id="fieldnameA"/>
        <property id="fieldnameB"/>
    </row>
 <row id="rownameB">
        <property id="fieldnameC"/>
        <property id="fieldnameD"/>
    </row>
</table>

3.  Type 1 fields add at the bottom
of the table node (inside the table node just under the row nodes)

 
<property id="fieldname"/>

I do this by hand and trying to for a handy script to automate it.
Hope that explains.
0
Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 
Julian HansenCommented:
Can you post some actual examples - full code - Where I am not clear on the examples you have posted is where additional fields are assumed - so for instance in your first example you have

<html>
<form id="HRPANFRM">
<input id="headerin_trantype_1">
<input id="headerin_trandexc_1"/>
<select id="Requestor"/>
</form
</html>

Open in new window

But then in the output you put a bunch of fields lastname, firstname, streeta, cityname etc with no indication of where those come from. The general case example you gave is also confusing.
It would help if you could post an actual example of full html code and full output that you create manually and we can take it from there.
0
 
KeithMcElroyAuthor Commented:
Sorry for the confusion and thank you for looking at this.  It is probably simpler than I am making it out to be.  However, I am stumped on how to create the xml from the html

Here is a real example web page with the following:
1  html elements that are either
a  three piece id  such as sectionA_lastname_1
b  single id such as Requestor

2. example output in comments.  search on dbcustom (near bottom of page)
this has the xml that looks something like this
<table id...
  <row id= ...
    <property id = ...
  </row>
</table>

The desired script would look at all of the html element id attributes and then
create an xml document



Here is the file

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>HR Personnel Action Notification</TITLE>


<!--

WORK LOG
Date   Name     Item(s)      Comments
8/13/2012   keith    mods based on new doc
8/22/2012



-->

</HEAD>
<BODY leftMargin="0" topMargin="0" MARGINHEIGHT="0" MARGINWIDTH="0">
<!-- #include FILE="..\wfformstandardheader.asp" -->
<div id="print-section" style="position:absolute;left:20px;top:50px">
<a href="javascript:printthis()">Print</a>
</div>

<FORM id="WebForm" name="WebForm" action="HRPANFRM.asp" method=post>


<!--TRIGGERS:  headerin_trantype_1 > -->
      <div id="init" style="background-color:white;position:absolute;padding:10px;left:60px;top:60px;width:900px;height:100px;border-style:solid;border-width:1px;border-color:steelblue;">
            <table>
                  <tr>
                  <td align="right"></td><td></td>
                  <td align="right" nowrap="nowrap">Request Code<select id="headerin_trantype_1" name="headerin_trantype_1" style="width:200px;"></select>
                  <input id="headerin_trandesc_1" name="headerin_trandesc_1" style="width:200px;" readonly value="">
            </td>

            <td>
            </td>
            </tr>
            </table>
      </div>


<!--TRIGGERS
sectionA_employid_1    sectionA_lastname_1     sectionA_firstname  class:searchString  >  
-->
      <div id="sectionA" progress="100%" style="background-color:white;position:absolute;padding:10px;left:60px;top:175px;width:900px;height:100px;border-style:solid;border-width:1px;border-color:steelblue;">
      <strong><u>A General Information</u></strong>


      <table>
            <tr>
                  <td>Last Name</td><td><input id="sectionA_lastname_1" name="sectionA_lastname_1" class="searchString"></td>  
                  <td>First Name</td><td><input id="sectionA_firstnam_1" name="sectionA_firstnam_1"  class="searchString"></td>
                  <td>Middle</td><td><input id="sectionA_middlein_1" name="sectionA_middlein_1"></td>
                  <td>Salutation</td><td><input id="sectionA_salutatn_1" name="sectionA_salutatn_1" ></td>
                  <td>Suffix</td><td><input id="sectionA_suffixin_1" name="sectionA_suffixin_1" ></td>  

            </tr>
      </table>
      <table>
            <tr>
                  <td>Employee #</td><td><input id="sectionA_employid_1" name="sectionA_employid_1" size=10 class="searchString"></td>
                  <td>SSN #</td><td><input id="sectionA_socialse_1" name="sectionA_socialse_1" size=12></td>
                  <td>Former Name</td><td><input id="sectionA_formname_1" name="sectionA_formname_1" size=25></td>
            </tr>
      </table>      


      </div>  



<!--
TRIGGERS
section_B_zipcodei_1  

-->

      <div id="sectionB" progress="100%" style="background-color:white;position:absolute;padding:10px;left:60px;top:300px;width:900px;height:100px;border-style:solid;border-width:1px;border-color:steelblue;">
            <strong><u>B Personal Information</u></strong>
            <table>
                  <tr>  
                        <td>Home Street Address</td><td><input id="sectionB_streetaa_1" name="sectionB_streetaa_1"><input id="sectionB_cityname_1" name="sectionB_cityname"></td>
                        <td>County</td><td><input id="sectionB_countyin_1" name="sectionB_countyin_1"></td>
                        <td>State</td><td><input id="sectionB_statecod_1" name="sectionB_statecod_1" size=2></td>
                        <td>Zip</td><td><input id="sectionB_zipcodei_1" name="sectionB_zipcodei_1" size=5>-<input id="sectionB_zipcodep_1" name="sectionB_zipcodep_1" size=4></td>
                        <!--load-picklists.js  loadZipInfo()-->
                  </tr>
            </table>

            <table>
                  <tr>
                        <td>Home Phone</td><td>
                              <input id="sectionB_homephmn_1" name="sectionB_homephmn_1" size=15>
                        </td>
                        <td>Cell Phone</td><td>
                              <input id="sectionB_cellphpr_1" name="sectionB_cellphpr_1" size=15>
                        </td>
                        <td>Personal Email</td><td>
                              <input id="sectionB_peremail_1" name="sectionB_peremail_1" size="20">
                        </td>
                        <td>Birth Date</td><td>
                              <input id="sectionB_dtbirthm_1" name="sectionB_dtbirthm_1" size=12>
                        </td>
                  </tr>
            </table>

            <table>
                  <tr>
                  
                  
                        <td>Work Phone</td><td>
                              <input id="sectionB_workphmn_1" name="sectionB_workphmn_1" size=15>
                        </td>
                        <td>Hire Date</td><td>
                              <input id="sectionB_dthireim_1" name="sectionB_dthireim_1" size=12>
                        </td>
                        <td>Probation End Date</td><td>
                              <input id="sectionB_dtprobem_1" name="sectionB_dtprobem_1" size=12>
                        </td>
                  </tr>
            </table>
                  
            
      </div>



<!--
TRIGGER   Section C
sectionC_deptinfo_1
sectionC_postitle_1

-->

<div id="sectionC" progress="100%"  style="background-color:white;position:absolute;padding:10px;left:60px;top:450px;width:900px;height:100px;border-style:solid;border-width:1px;border-color:steelblue;">
<strong><u>C.  New Hire Information</u></strong>
      <table>
            <tr>    
                  <td>Effective Date</td><td>
                        <input id="sectionC_dteffcim_1" name="sectionC_dteffcim_1" size=12>
                  </td>
                  <td>Dept</td><td>
                        <input id="sectionC_deptinfo_1" name="sectionC_deptinfo_1" size="5">
                  </td>
                  <td>Division</td><td>
                        <input id="sectionC_divinfor_1" name="sectionC_divinfor_1" size="5">
                  </td>
            </tr>
            <tr>
                  <td></td>
                  <td></td>
                  <td></td>
                  <td></td>
                  <td>Work Loc</td><td>
                        <input id="sectionC_workloca_1" name="sectionC_workloca_1" size="5">
                  </td>
            </tr>      
      </table>  

      <table>
            <tr>
                  <td>Check Dist code</td><td>
                        <input id="sectionC_checkdis_1" name="sectionC_checkdis_1" size="5" >
                        
                  </td>
                  <td>Position Title</td><td>
                        <input id="sectionC_postitle_1" name="sectionC_postitle_1" size=5>
                  </td>
                  <td>Position #</td><td>
                        <input id="sectionC_position_1" name="sectionC_position_1"/>
                  </td>
            </tr>      
      </table>

      <table>  
            <tr>
                  <td>Pay Schedule/Grade/Step </td><td>
                        <select id="sectionC_paysched_1" name="sectionC_paysched_1" />  <!--populateHourlyRate_SectionC-->
                  </td>
                  <td>Hourly Rate</td><td>
                        <input id="sectionC_hourrate_1" name="sectionC_hourrate_1" size=5>
                  </td>  
                  <td>Annual Salary</td><td>
                        <input id="sectionC_newannua_1" name="sectionC_newannua_1" size=5>
                  </td>
                  <td>FTE</td><td>
                        <input id="sectionC_fteinfor_1" name="sectionC_fteinfor_1" size=5>
                  </td>
                  <td>Status</td><td>
                        <input id="sectionC_statusin_1" name="sectionC_statusin_1"  size="3">
                  </td>
                  
            </tr>      
      </table>    
        
      
      <table>
            <tr>
                  <td>Incumbent's Name</td>
                  <td><input id="sectionC_incuname_1" name="sectionC_incuname_1"></td>
                  <td>Incumbent's ID</td>
                  <td><input  id="sectionC_incuidin_1" name="sectionC_incuidin_1" size="10"></td>
            </tr>
      </table>

</div>

<!--
TRIGGERS
sectionD_newdepti_1  >
sectionD_newtitle_1  > popPosDescNew, popSalaryInfo


-->

<div id="sectionD" progress="100%"  label="All other transaction types" style="background-color:white;position:absolute;padding:10px;left:60px;top:670px;width:900px;height:150px;border-style:solid;border-width:1px;border-color:steelblue;">
<strong><u>D. All other transaction types</u></strong>
      <table>
            <tr>
                  <td>Effective Date</td>
                  <td>
                        <input id="sectionD_effcatem_1" name="sectionD_effcatem_1" size=12>
                  </td>
                  <td>New Department</td>
                  <td>
                              <input id="sectionD_newdepti_1" name="sectionD_newdepti_1" size="8">

                  </td>
                  <td>New Division</td>  
                  <td>
                              <input id="sectionD_newdivis_1" name="sectionD_newdivis_1" size="8">

                  </td>
            </tr>      
            <tr>
                  <td></td>
                  <td></td>
                  <td></td>
                  <td></td>
                  <td>New Work Loc</td>
                  <td>
                              <input id="sectionD_newwkloc_1" name="sectionD_newwkloc_1" size="8">

                  </td>
                  
            </tr>
      </table>

                  
      <table>
      <tr>
                  <td>New Check Dist Code</td>
                  <td><select id="sectionD_newckdis_1" name="sectionD_newckdis_1"></td>
                  <td>New Position Title</td>
                  <td>
                        <input id="sectionD_newtitle_1" name="sectionD_newtitle_1"/>
                  </td>
                  <td>New Position</td>
                  <td><input id="sectionD_newposit_1" name="sectionD_newposit_1" size="12"></td>                        

            </tr>
      </table>

                                                                                                      

      <table>
            <tr>
                  <td>New Pay Schedule/Grade/Step</td>
                        <td><input id="sectionD_newpaysc_1" name="sectionD_newpaysc_1" size="10"></td>

                  <td>New Hourly Rate</td>
                  <td>
                        <input id="sectionD_newhourl_1" name="sectionD_newhourl_1" size=10>
                  </td>
                  <td>New Annual Salary</td>
                  <td><input id="sectionD_newsalar_1" name="sectionD_newsalar_1" size="10"></td>
                  <td>New FTE</td>
                  <td><input id="sectionD_newftein_1" name="sectionD_newftein_1" size="3"></td>
                  <td>New Status</td>
                        <td><input id="sectionD_newstatu_1" name="sectionD_newstatu_1" size="4"></td>

                  </tr>
      </table>

      <table>
            <tr>
                  <td>Incumbent's Name</td>
                  <td><input id="sectionD_incumnam_1" name="sectionD_incumnam_1"></td>
                  <td>Incumbent's Id</td><td><input id="sectionD_incumidi_1" name="sectionD_incumidi_1"></td>
            </tr>
      </table>

      <table>
            <tr>
                  <td>Current Pay Schedule/Grade/Step</td><td>
                        <input id="sectionD_currsche_1" name="sectionD_currsche_1"  size="12">
                  </td>
                  <td>Current Position Title</td><td>
                        <input id="sectionD_currtitl_1" name="sectionD_currtitl_1" size=22>
                  </td>
                  <td>Current Position #</td><td>
                        <input id="sectionD_currposi_1" name="sectionD_currposi_1" size=12>
                  </td>
                  

            </tr>      
      </table>

</div>





<div id="sectionE" progress="100%" label="Leave Of Absence or Suspension Information" style="background-color:white;position:absolute;padding:10px;left:60px;top:950px;width:900px;height:100px;border-style:solid;border-width:1px;border-color:steelblue;">
<strong><u>E.  Leave of Absence or Suspension Information</u></strong>
      <table>
            <tr>
                  <td>Start Date</td><td>
                        <input  id="sectionE_startdat_1" name="sectionE_startdat_1"/>
                  </td>
                  <td></td>
            </tr>
            <tr>
                  <td>Anticipated End Date</td><td>
                        <input  id="sectionE_antenddt_1" name="sectionE_antenddt_1"/>
                  </td>
                  <td>Actual Return date</td><td>
                        <input  id="sectionE_actretdt_1" name="sectionE_actretdt_1"/>
                  </td>
            </tr>            

      </table>

</div>




<div id="sectionF" progress="100%" label="Employment Separation Information" style="background-color:white;position:absolute;padding:10px;left:60px;top:1070px;width:900px;height:100px;border-style:solid;border-width:1px;border-color:steelblue;">
<strong><u>F. Employment Separation Information</u></strong>
      <table>
            <tr>
                  <td>Resignation Date</td>
                  <td>
                        <input id="sectionF_dtresigm_1" name="sectionF_dtresigm_1" size=12>
                  </td>
                  <td>Retirement Date</td>
                  <td>
                        <input id="sectionF_dtretirm_1" name="sectionF_dtretirm_1" size=12>
                  </td>
                  <td>Involuntary Termination Date</td>
                  <td>
                        <input id="sectionF_dttermim_1" name="sectionF_dttermim_1" size=12>
                  </td>
      </table>

</div>



<div id="sectionG" progress="100%" label="Labor Distribution Accounts" style="overflow: scroll;background-color:white;position:absolute;padding:10px;left:60px;top:1195px;width:900px;height:200px;border-style:solid;border-width:1px;border-color:steelblue;">
<strong><u>G. Labor Distribution Accounts</u></strong>
      <table>
            <thead>
            <tr>
                  <td></td>
                  <td>Dept Code</td>
                  <td>Account</td>
                  <td>Percent</td>
            </tr>
            </thead>
            <tbody id="rowdetail">
            <tr>
            <td><input type=button id='sectionG_removbtn_1'  value='X' onclick='removeLineItem(this)'></td>
            <td><input id='sectionG_deptcode_1' name='sectionG_deptcode_1' class='deptcode'></td>
            <td><input id='sectionG_accounti_" & CStr(r) & "'  name='sectionG_accounti_1' class='accounti'></td>
            <td><input id='sectionG_percenti_" & CStr(r) & "'  name='sectionG_percenti_1' class='percenti'  onblur='totalRows()'></td>
            </tr>"

            
            
            
            </tbody>
            
            <tfoot>
            <tr>
                  <td></td>
                  <td> <input type=button value='Add' onclick="addLineItem(this)" id='AddButton'></td>
                  <td></td>
                  <td><input id="sectionG_percttli_1" name="sectionG_percttli_1"></td>
            </tr>
            </tfoot>
      </table>

</div>




<div id="sectionH" progress="100%" label="Department Notes" style="background-color:white;position:absolute;padding:10px;left:60px;top:1420px;width:900px;height:100px;border-style:solid;border-width:1px;border-color:steelblue;">
<strong><u>H. Department Notes<br></u></strong>
<textarea id="sectionH_deptnote_1" name="sectionH_deptnote_1" rows="10" cols="80">
</textarea>

</div>

<div id="sectionI" progress="100%" label="HR Only" style="background-color:white;position:absolute;padding:10px;left:60px;top:1640px;width:900px;height:100px;border-style:solid;border-width:1px;border-color:steelblue;">
<strong><u>I. HR Only<br></u></strong>
      <table>
            <tr>
                  <td>Retro Pay Due?</td><td><input type=checkbox id="chksectionI_retropay_1"  parent="sectionI_retropay_1">
                                                <input type=hidden id="sectionI_retropay_1" name="sectionI_retropay_1">
                  </td>
                  <td>HR Notes</td><td><textarea id="sectionI_hrnotesi_1" name="sectionI_hrnotesi_1" cols="80" rows="2"></textarea></td>
            </tr>
      </table>
</div>

<div id="sectionJ" progress="100%"  label="Vacancy Report" style="background-color:white;position:absolute;padding:10px;left:60px;top:1760px;width:900px;height:100px;border-style:solid;border-width:1px;border-color:steelblue;">
<strong><u>J. Vacancy Report<br></u></strong>

      <table>
            <tr>
                  <td>Department/Division</td><td><select id="sectionJ_deptdivi_1"  name="sectionJ_deptdivi_1" />
                  </td>
            </tr>      
      </table>
      <table>
            <tr>
                  <td>Position Title</td><td><select id="sectionJ_posittle_1" name="sectionJ_posittle_1"/></td>
                  <td>&nbsp;&nbsp;Full Time</td><td><input type="radio" id="chksectionJ_ptfttime_1" name="chksectionJ_ptfttime_1" parent="sectionJ_ptfttime_1"/>&nbsp;
                  Part Time<input type="radio" id="chksectionJ_ptfttime_1" name="chksectionJ_ptfttime_1" parent="sectionJ_ptfttime_1"/>
                  <input type="hidden" id="sectionJ_ptfttime_1" name="sectionJ_ptfttime_1" /></td>
            </tr>
      </table>
      <table>
            <tr>            

                  <td>Min Pay Schedule/<br>Grade/Step</td><td><input id="sectionJ_minsched_1"  name="sectionJ_minsched_1" ></td>
                  <td>Min Hourly <br>Rate</td><td><input id="sectionJ_minsalar_1"  name="sectionJ_minsalar_1" ></td>
                  <td>Min Annual <br>Salary</td><td><input id="sectionJ_minhour_1"  name="sectionJ_minhour_1" ></td>
            </tr>
            
            <tr>            

                  <td>Max Pay Schedule/<br>Grade/Step</td><td><input id="sectionJ_maxsched_1"  name="sectionJ_maxsched_1" ></td>
                  <td>Max Hourly <br>Rate</td><td><input id="sectionJ_maxsalar_1"  name="sectionJ_maxsalar_1" ></td>
                  <td>Max Annual <br>Salary</td><td><input id="sectionJ_maxhour_1"  name="sectionJ_maxhour_1" ></td>

      </tr>
                                                                        
      </table>
      <table>
      <tr>  
                  <td>Date position became available</td>
                  <td><input id="sectionJ_dtavailim_1" name="sectionJ_dtavailim_1" size=2>
                  </td>
                  <td>Name of former incumbent</td><td><input id="sectionJ_formincu_1" name="sectionJ_formincu_1" size=10></td>
            </tr>
      </table>    
      <table>
            <tr>
                  <td>Reason position became vacant:</td><td colspan="3"><select  id="sectionJ_reasonch_1" name="sectionJ_reasonch_1" /></td>
                  <td>Incumbent Id</td><td><input type=text id="sectionJ_incumbid_1" name="sectionJ_incumbuid_1"></td>
            </tr>            

      </table>
      <table>
            <tr>
                  <td>Notes:</td><td colspan="3">If OTHER is selected, Notes must be filled in
                  <textarea  id="sectionJ_reasonin_1" name="sectionJ_reasonin_1"  cols="80" rows="2"></textarea></td>
            </tr>            

      </table>

</div>
<div id="hiddenarea">
      <input type="hidden" id="hiddenin_curracti_1" name="hiddenin_curracti_1"/>
      <input type="hidden" id="hiddenin_HRunqkey_1" name="hiddenin_HRunqkey_1"/>      
      <input type="hidden" id="hiddenin_PYunqkey_1" name="hiddenin_PYunqkey_1"/>
      
      

</div>


<div id="logininfo" style="background-color:white;position:absolute;padding:10px;left:60px;top:2070px;width:900px;height:100px;border-style:solid;border-width:1px;border-color:steelblue;">
      IFAS User Id:<INPUT size=8 id=Requestor name=Requestor   readonly>
<INPUT type=hidden id=Connection name=Connection >
      
</div>


<!--dbcustom  sample output:


<table id="HRPANFRM" object="Webform">
<row id="headerin">
      <property id="trantype"/>
      <property id="trandesc"/>
</row>
<row id="sectionA">
      <property id="lastname"/>
      <property id="firstnam"/>
      <property id="middlein"/>
      <property id="employid"/>
      <property id="socialse"/>
      <property id="formname"/>
      <property id="salutatn"/>  
      <property id="suffixin"/>
</row>
<row id="sectionB">
      <property id="streetaa"/>
      <property id="cityname"/>
      <property id="countyin"/>
      <property id="statecod"/>
      <property id="zipcodei"/>
      <property id="zipcodep"/>
      <property id="homephmn"/>
      <property id="cellphpr"/>
      <property id="peremail"/>
      <property id="dtbirthm"/>
      <property id="workphac"/>
      <property id="workphmn"/>
      <property id="dthireim"/>
      <property id="dtprobem"/>
</row>
<row id="sectionC">
      <property id="dteffcim"/>
      <property id="deptinfo"/>
      <property id="divinfor"/>
      <property id="workloca"/>
      <property id="checkdis"/>
      <property id="position"/>
      <property id="paysched"/>
      <property id="hourrate"/>
      <property id="newannua"/>
      <property id="fteinfor"/>
      <property id="statusin"/>
      <property id="incuname"/>
      <property id="incuidin"/>
      <property id="effcatem"/>
      <property id="effcated"/>
      <property id="effcatey"/>
</row>
<row id="sectionD">
      <property id="effcatem"/>
      <property id="newdepti"/>
      <property id="newdivis"/>
      <property id="newwkloc"/>
      <property id="newckdis"/>
      <property id="newposit"/>
      <property id="newpaysc"/>
      <property id="newhourl"/>
      <property id="newsalar"/>
      <property id="newftein"/>
      <property id="newstatu"/>
      <property id="incumnam"/>
      <property id="incumidi"/>
      <property id="currsche"/>
      <property id="currtitl"/>
      <property id="currposi"/>
</row>
<row id="sectionE">
      <property id="startdat"/>
      <property id="antenddt"/>
      <property id="actretdt"/>
</row>
<row id="sectionF">
      <property id="dtresigm"/>
      <property id="dtretirm"/>
      <property id="dttermim"/>
</row>
<row id="sectionG">
      <property id="deptcode"/>
      <property id="accounti"/>
      <property id="percenti"/>
      <property id="percttli"/>
</row>
<row id="sectionH">
      <property id="deptnote"/>
</row>
<row id="sectionI">
      <property id="retropay"/>
      <property id="hrnotesi"/>
</row>
<row id="sectionJ">
      <property id="deptdivi"/>
      <property id="posittle"/>
      <property id="ptfttime"/>
      <property id="minsched"/>
      <property id="minsalar"/>
      <property id="minhourl"/>
      <property id="maxsched"/>
      <property id="maxsalar"/>
      <property id="maxhourl"/>
      <property id="dtavailim"/>
      <property id="formincu"/>
      <property id="reasonch"/>
      <property id="reasonin"/>
      <property id="reasonin"/>
</row>
<row id="hiddenin">
      <property id="curracti"/>
      <property id="HRunqkey"/>
      <property id="PYunqkey"/>
</row>
</row>
<property id="Requestor"/>
<property id="Connection"/>
<property id="ExtState"/>
</table>





-->



      
</FORM>
<div id="footer" style="position:absolute;left:0px;top:23px;">
</BODY>
</HTML>
0
 
Julian HansenCommented:
Ok looking at it.

Just for next time - either put your code inside code tags (see code item on toolbar) or attach as file - makes posts a little shorter :)
0
 
Julian HansenCommented:
I have some questions:

Do you have control over the HTML i.e. can you change it to add classes to elements or restructure code?

Any particular reason why the sections are broken into two tables - is there a reason for this or can it be made into a single table

You only want the id's of the inputs pulled - not the values?
The field ExtState at the end - where does that come from?
0
 
Julian HansenCommented:
Ok here is a first pass attempt.

Put this in your head function - not 100% complete but need to know if I am going in the right direction here
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
  var output = '';
  var sect = currentsect = '' ;
  $('input').each(function() {
    id = $(this).attr('id');
    idx = id.indexOf('_');
    idx2 = id.indexOf('_', idx+1);
    if (idx > 0 && idx2 > 0) {
      sect = id.substring(0, idx);
      if (sect != currentsect) {
        if (currentsect != '') {
          output += "</row>\n";
        }
        output += "<row id=\"" + sect + "\">\n";
        currentsect = sect;
      }
      property = id.substring(idx+1, idx2);
      output += "\t<property id=\"" + property + "\" />\n";
    }
  });
  output+= "<row>\n";
  $('#result').text(output);
});
</script>

Open in new window

0
 
KeithMcElroyAuthor Commented:
Yes, this is on the right track.

The row id is the first section of the id, the nested property id is the second section of the id

If the script even did this, it would save developers lots of time typing this out manually.
The remaining requirements are icing on the cake.

Once you are done, I will use this often and probably dig in and learn the code behind how you did it.

Sorry again for the confusion.  
You are really helping me alot with this.
0
 
Julian HansenCommented:
No problem - so If I understand you correctly  then the output from that script is what you are looking for.

Where do you want the output to go - currently I am sending it to a div that is overlaid on the form so you can see the results.

When done you should be able to put this in a script file and just include that on the page - depending on where you want the output to go and how we can add buttons to trigger it if it is not required to do anything on opening.

Adding the other bits won't be that difficult - just need to know the answers to the above i.e.
Where must output go
How must process be triggered.

The script basically finds every input element in the document.
Strips out its id attribute
Looks for the first and second '_' and if it finds both chops out the bit before the first one and compares it to a variable that is keeping track of the sections.
If they are different it checks to see if this is the first section - if not it closes the row and opens another otherwise it opens the row.
After that it chops out the bit between the '_' and puts it into a property element.

That's pretty much it.

The preamble
<table id="HRPANFRM" object="Webform">

Open in new window

Will that always be the same - what are the rules for that?

Apart from wrapping the output in a <table> element what else do you need it to do that it does not do already?
0
 
KeithMcElroyAuthor Commented:
put non separated inputs into
property node after all the rows.

For example
<input id=Requestor>

would be at the end as

<property id="Requestor">

The output to the textarea works great.
Is there a way to include selects as well?
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.