How get the textbox values in array.....to store in database_问答_开发者

this is my code...

How get the textbox array value to store in database...

<html>
    <head>
        <script type="text/javascript">
            var max = 4; //highest number to go to
            var currentIndex = 0;
            function btnClick() {
                if(currentIndex < max){
                    currentIndex++;
                    postClick();
                }
            }
            function Previous(){
                if(currentIndex>0){
                    currentIndex--;
                    postClick();
                }
            }

            function postClick() {//whatever you want to happen goes here
                var sahans = new Array();
                sahans[currentIndex] == d;
                var d = document.getElementById("div");
                d.innerHTML   = "<p><input type='text' name='name"+currentIndex+"[]'>";
                d.innerHTML  += "<p><input type='text' name='topic"+currentIndex+"[]'>";
                document.getElementById("div").style.display = ""; 
            }
        </script>
    </head>
    <body>
        <form id="form1">
            <div>
                <input type="button" value="Previous" onclick="Previous();" />
                <input type="button" value="Next" onclic开发者_如何学运维k="btnClick();" />
                <div id="div"></div>
            </div>
        </form>
    </body>
</html>

JavaScript:

function store(form) {
    var input = form.getElementsByTagName('input');
    var myarray = Array();
    for (var i = 0; i < input.length; i++) {
        if (input[i].getAttribute('type') == 'text') {
            myarray[input[i].getAttribute('name')] = input[i].value;
        }
    }
    for (var i in myarray) {
        alert(i + ': ' + myarray[i]);
    }
}

HTML:

<form onsubmit="store(this); return false">
    <p>
        <input type="text" name="name" /><br />
        <input type="text" name="topic" />
    </p>
    <p>
        <input type="submit" value="Store in database" />
    </p>
</form>

Edit:

Ok, now I made a full example with AJAX and the actual saving to the database. The AJAX call uses 'POST'. Simply fill in the number of fields that you want in the max variable.

JavaScript:

var max = 10;
var current = 0;
function goto(form, pos) {
    current += pos;
    form.prev.disabled = current <= 0;
    form.next.disabled = current >= max - 1;
    var fields = form.getElementsByTagName('fieldset');
    for (var i = 0; i < fields.length; i++) fields[i].style.display = 'none';
    fields[current].style.display = 'block';
    form['name' + current].focus();
}
function store(form) {
    var input = form.getElementsByTagName('input');
    var data = '';
    for (var i = 0; i < input.length; i++) {
        if (input[i].getAttribute('type') == 'text')
            data += '&' + input[i].getAttribute('name') + '=' + input[i].value;
    }
    data = encodeURI('n=' + max + data);
    var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
    xhr.open('POST', 'store.php', true);
    xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
    xhr.setRequestHeader('Content-length', data.length);
    xhr.setRequestHeader('Connection', 'close');
    xhr.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            if (this.responseText != '')
                alert(this.responseText);
            else {
                form.submit.value = 'Saved!';
                setTimeout(function() { form.submit.value = 'Save to database' }, 500);
            }
        }
    }
    xhr.send(data);
}
window.onload = function() {
    var form = document.forms[0];
    var container = form.getElementsByTagName('div')[0];
    container.innerHTML = '';
    for (var i = 0; i < max; i++)
        container.innerHTML += '<fieldset><legend>Entry ' + (i + 1) + ' / ' + max + '</legend><input type="text" name="name' + i + '" /><br /><input type="text" name="topic' + i + '" /></fieldset>';
    goto(form, 0);
}

HTML:

<form action="submit.php" method="post" onsubmit="store(this); return false">
    <p>
        <input type="button" name="prev" onclick="goto(this.form, -1)" value="Previous" />
        <input type="button" name="next" onclick="goto(this.form, +1)" value="Next" />
    </p>
    <div>
        <noscript>Please enable JavaScript to see this form correctly.</noscript>
    </div>
    <p>
        <input type="submit" name="submit" value="Store in database" />
    </p>
</form>

Users who have JS disabled will see what's in the <noscript> tag, otherwise it's replaced with the fieldsets. Also it's good to make an alternative submit page (submit.php) for users who have JS disabled. Below is store.php, the AJAX submit script.

PHP (store.php):

<?php
if (empty($_POST['n']) || $_POST['n'] < 1) die('Invalid request!');

$fields = array('name', 'topic');
$errors = '';

for ($i = 0; $i < $_POST['n']; $i++) {
    foreach ($fields as $field) {
        if (empty($_POST[$field . $i]))
            $errors .= '- ' . $field . ' ' . ($i + 1) . "\n";
    }
}
if ($errors != '')
    die("Please fill in the following fields:\n" . $errors);

$db = mysql_connect('localhost', 'root', '');
mysql_select_db('mydb', $db);

for ($i = 0; $i < $_POST['n']; $i++) {
    $name = mysql_real_escape_string($_POST['name' . $i]);
    $topic = mysql_real_escape_string($_POST['topic' . $i]);
    mysql_query('   INSERT INTO entries (id, name, topic) VALUES (' . $i . ', "' . $name . '", "' . $topic . '")
                    ON DUPLICATE KEY UPDATE name = "' . $name . '", topic = "' . $topic . '"
    ') or die('Database error!');
}

mysql_close($db);
?>

The output text of this script (if there is an error) is displayed in the JavaScript alert.

I hope it's working for you now.

This would be help ful for you


    <input type="textbox" name="Tue[]" />
    <input type="textbox" name="Tue[]" />
    <input type="textbox" name="Tue[]" />
    <input type="textbox" name="Tue[]" />
    <script type="text/javascript">
        function validateText(event){
            var tar_ele = $(event.target);
            if(tar_ele.val() is not valid)
                tar_ele.focus();
        }
    </script>


<input type="text" name="Tue[]" onblur="validateText(event)"/>

javascript text box array and get values and focus on particular field