Extract form and input fields from HTML

Question

I want to extract and echo Attribute Values from both form and input fields from a given HTML. I found that its possible with DOMDocument.

One specific input needs to be grouped by a <div style="position: absolute; left: -5000px;"></div>

I thought that I can either search for if the parent element of the input has this style attributes or if the name of the input field is similiar to b_7e0d9965bedeea1cc5f7217a9_4685998a30. But I have no idea how to do that.

This is the code:

$html = $theme['html']; // From a text input field
$dom = new DOMDocument();
if (@$dom->loadHTML($html)) {

    $forms = $dom->getelementsbytagname('form');

    foreach ($forms as $form) {

        $form_action        = $form->getAttribute('action');
        $form_method        = $form->getAttribute('method');
        $form_id                = $form->getAttribute('id');
        $form_name          = $form->getAttribute('name');
        $form_class         = $form->getAttribute('class');
        $form_target        = $form->getAttribute('target');

        echo '<form';
        if (!empty($form_action)) { echo ' action="'. $form_action .'"'; } 
        if (!empty($form_method)) { echo ' method="'. $form_method .'"'; }
        if (!empty($form_id)) { echo ' id="'. $form_id .'"'; }
        if (!empty($form_name)) { echo ' name="'. $form_name .'"'; }
        if (!empty($form_class)) { echo ' class="'. $form_class .'"'; }
        if (!empty($form_target)) { echo ' target="'. $form_target .'"'; } 
        echo '>';

        $inputs = $dom->getelementsbytagname('input');

        foreach ($inputs as $input) {

            $input_name     = $input->getAttribute('name');
            $input_value    = $input->getAttribute('value');
            $input_id           = $input->getAttribute('id');
            $input_type     = $input->getAttribute('type');
            $input_class    = $input->getAttribute('class');

            echo '<input';
            if (!empty($input_name)) { echo ' name="'. $input_name .'"'; } 
            if (!empty($input_value)) { echo ' value="'. $input_value .'"'; }
            if (!empty($input_id)) { echo ' id="'. $input_id .'"'; }
            if (!empty($input_type)) { echo ' type="'. $input_type .'"'; }
            if (!empty($input_class)) { echo ' class="'. $input_class .'"'; }
            echo '>';

        }

        echo '</form>';
    }
}

Some Background Info: I want the user to copy and paste his Email Form Code into a Textbox. Then I want to extract the attributes of the Input Fields to use them inside my Template.

Answer 1

Here are the few things wrong with your syntax

$html = $theme['html']; // Make sure $html is a String
$dom = new DOMDocument();
//if (@$dom->loadHTML($html)) {
if ($dom->loadHTML($html)) {  //remove @
  //$forms = $dom->getelementsbytagname('form');
   $forms = $dom->getElementsByTagName("form");

Make these changes and check again. Hope it should work then

To get the parent node of each input field, you can use

 $parentOfInput = $input->parentNode();
 $parentAttribute = $parentOfInput->getAttribute('style');

To group each form in a div, try doing this:

  //echo '<form';
   echo '<div style="position: absolute; left: -5000px;"><form'

and at the end

 //echo '</form>';
  echo '</form></div>'    

In case you want to insert the whole form in an existing div, you cannot do this with PHP. As once the HTML is renedered, you cannot insert HTML using PHP.

However you can use javascript or in your case AJAX. Save the whole HTML that you are echoing, in a variable. Then pass that variable in an AJAX call.

 $.ajax({url: "urFile.php"}).done(function( stringOfHTMLYouFormed ) {
    $("#divID").append(stringOfHTMLYouFormed );
 });

Answer 2

I added $parent = $input->parentNode->getAttribute('style'); into the foreach loop to look for the style of the Parent.

Right after it I use to test if the $parent has the desired style to wrap then the corresponding input field into a div.

$parent = $input->parentNode->getAttribute('style');
if ($parent == 'position: absolute; left: -5000px;') {
    echo '<div style="position: absolute; left: -5000px;">';
    echo '<input';
    if (!empty($input_name)) { echo ' name="'. $input_name .'"'; } 
    if (!empty($input_value)) { echo ' value="'. $input_value .'"'; }
    if (!empty($input_id)) { echo ' id="'. $input_id .'"'; }
    if (!empty($input_type)) { echo ' type="'. $input_type .'"'; }
    if (!empty($input_class)) { echo ' class="'. $input_class .'"'; }
    echo '></div>';
} else {            
    echo '<input';
    if (!empty($input_name)) { echo ' name="'. $input_name .'"'; } 
    if (!empty($input_value)) { echo ' value="'. $input_value .'"'; }
    if (!empty($input_id)) { echo ' id="'. $input_id .'"'; }
    if (!empty($input_type)) { echo ' type="'. $input_type .'"'; }
    if (!empty($input_class)) { echo ' class="'. $input_class .'"'; }
    echo '>';
}