JS Form Functions

<?php

ob_start();

if( $_POST )
{
    ob_clean(); 

    echo '<pre>';
    print_r( $_POST );
    echo '</pre>';

    exit(); 
}
?>

<script>

function array2obj(arr){
    var oret = null;

    var len = arr.length;
    if( len ){
        oret = {};
        for(var i=0; i<len; i++){

            oret[arr[i]]=i;
        }
    }
    return oret;
}

function formData2Querysreting(frm,option)
{
    var accept = option['accept'] || null;
    var reject = option['reject'] || null;

    var additional = option['additional'] || null;
    
    var sret = '';

    var ele, i;

    if( reject ){
        reject = array2obj( reject.split(',') );

    }
    if( accept ){
        accept = array2obj( accept.split(',') );
    }

    
    for (i = 0; i < frm.elements.length; i++) {
        ele = frm.elements[i];

        var ename = ele['name']; 

        if( '' == ename ){

            continue;
        }
        
        if( ele['disabled'] ){
            continue;

        }
        
        if( accept ){
            if( !(ename in accept) ){
                continue;

            }
        }else if( reject ){
            if( ename in reject){

                continue;
            }
        }
        
        
        switch (ele.type.toLowerCase()) {

        // Text fields, hidden form elements
        case 'text':
        case 'hidden':

        case 'password':
        case 'textarea':
        case 'select-one':

            sret += ename + '=' + encodeURIComponent(ele.value) + '&'
            break;
            

        // Multi-option select
        case 'select-multiple':
            for(var j = 0; j < ele.options.length; j++) {

            var currOpt = ele.options[j];
            if(currOpt.selected) {
                sret += ename + '=' + encodeURIComponent(currOpt.value) + '&';

            }
            }
            break;

        // Radio buttons
        case 'radio':

            if (ele.checked) {
            sret += ename + '=' + encodeURIComponent(ele.value) + '&'

            }
            break;
            
        // Checkboxes
        case 'checkbox':

            if (ele.checked) {
                // Collapse multi-select into comma-separated list
                sret += ename + '=' + encodeURIComponent(ele.value) + '&';

            }
            break;
        }
    }

    if( additional ){

        var tp = (typeof(additional)).toLowerCase();
        if( 'string' == tp ){

            sret += additional + '&';
        }else if( 'object' == tp ){

            for( var k in additional){
                if( 'function' != (typeof(additional[k])).toLowerCase() ){

                    sret += k + '=' + additional[k] + '&';
                }
            }
        }

    }
    
    // Remove trailing separator
    sret = sret.substr(0, sret.length - 1);

    ele = null;
    return sret;
}





window.onload = function (){

    window['dvdebug'] = document.getElementById('dvdebug');
}

function debug( str , append){

    append = append || false;
    if( append ){
        window['dvdebug'].innerHTML = str + '<hr>' + window['dvdebug'].innerHTML;

    }else{
        window['dvdebug'].innerHTML = str;
    }
}

function doajax( frm ){
    var callback_1 = {
        success: function(o){
            debug( o.responseText);

        }
    };

 
    var option =
    {

        accept:document.getElementById('accept_list').value,
        reject:document.getElementById('reject_list').value,

        additional:document.getElementById('additional').value,
        timestamp:true
    }

    var post_data  = formData2Querysreting(frm, option);
    
    post_data +='&ajax=1';
    var uri = 'jsfill.html';

    YAHOO.util.Connect.asyncRequest('POST', uri, callback_1, post_data);
}

</script>
<script type="text/javascript" src="/YAHOO_UTIL_CONNECT.js"> </script>

<!-- <input type="checkbox" id="collapseMulti" ><label for="collapseMulti" >Collapse Multipe </label><br> -->
Accept List<input type='text' id='accept_list' value='' size='100'><br>

Reject List<input type='text' id='reject_list' value='' size='100'><br>
Additional <input type='text' id='additional' value='' size='100'><br>


<br>

<form  method='post' target='iframe1'>
    <input type="hidden" name="hid1" value="hidden 1" />

    <input type="text" name="data" value="text box 1" />
    <input type="checkbox" name="chk1" value="101" />

    <input type="radio" name="rdo1" value="102" />
    <select name="sel1" >

        <option value=''>--Select--</option>
        <option value='YES'>Yes</option>
        <option value='NO'>No</option>

    </select>

    <select name="sel2[]" multiple size="4">
        <option value=''>--None--</option>

        <option value='C01'>Cat_01</option>
        <option value='C02'>Cat_02</option>
        <option value='C03'>Cat_03</option>

    </select>

    <input type="text" name="data[]" value="000" />

    <input type="text" name="data[]" value="111" />

<select name="sel3[]" multiple size="4">

    <option value=''>--None--</option>
    <option value='C01'>Cat_01</option>
    <option value='C02'>Cat_02</option>

    <option value='C03'>Cat_03</option>
</select>
<select name="sel3[]" multiple size="4">

    <option value=''>--None--</option>
    <option value='C101'>Cat_01</option>
    <option value='C102'>Cat_02</option>

    <option value='C103'>Cat_03</option>
</select>

<input type='submit' value="Submit" />

<input type="button" value="Ajax" onclick="javascript:doajax(this.form)" />
<input type="reset" value="Reset" />

</form>

<table><tr>
<td valign='top' ><iframe id='iframe1' name='iframe1' height="500"></iframe></td>

<td valign='top' id='dvdebug'>&nbsp;</td>
</tr></table>