CODEWITHSUNDEEP
javascripthtmlforms
Brds
Brds

Reputation: 1076

javascript to change hidden value then submit form

(I've searched for something similar, but haven't found anything that matches and/or works)

I have a progress review form where the user reviews their settings from previous steps. Below is the form as I have it now:

<form id='reviewForm' name='reviewForm' action='?action=ae&view=makeWorkFlow' method='post'>
    <table width='100%'>
        <tr>
            <th width='150'>Workflow Name</th>
            <td>" . $workflowName . "</td>
        </tr>
        <tr>
        <th valign='top'>Tasks</th>
            <td>
                <table width='99%'>
                    <tr>
                        <td>
                            <select name='task_1'>
                                <option value='0'>Select a Task</option>
                                <ALL OTHER OPTIONS>
                            </select>
                        </td>
                        <td><input type='text' name='turnAround_1' value='#VALUE#' onkeyup="if (/[a-z\s,$]/ig.test(this.value)) this.value = this.value.replace(/[a-z\s,$]/ig,'')" placeholder='Turn Around Time (hours)' /> Hours</td>
                    </tr>
                </table>
            </td>
        </tr>
        <tr>
            <td colspan='2'>
                <input type='hidden' id='step' name='step' value='4' />
                <input type='submit' name='submit' value='Create Workflow' />&nbsp;&nbsp;
                <input type='button' value='Update Changes' onclick='setStep();' />&nbsp;&nbsp;
                <input type='button' value='Cancel' onclick='javascript:history.go(-3);' />
            </td>
        </tr>
    </table>
</form>

So, basically, the user has already selected items from a list of dropdowns. I need to show them a "review" page where they have the option to change their selections and click the "Update Changes" button. When the click that button, the value of the "step" hidden field needs to be changed from 4 to 3 and then submit the form via the "setStep" function, which is as follows:

<script language='JavaScript' type='text/javascript'>
    function setStep()
    {
        document.forms["reviewForm"].step.value = 3;
        var t = setTimeout("document.reviewForm.submit();", 0);
    }
</script>

I realize that the setTimeout isn't the best way to do it, but it's just where I'm out now in trying to figure this out. I'm sure it's some small thing i'm missing that would fix this, but I've been at this for just over an hour and can't find it.

Upvotes: 1

Views: 12860

Answers (3)

swapnilsarwe
swapnilsarwe

Reputation: 1300

The issue is that the name of the submit button is submit

Hence while resolving document.reviewForm.submit()

It does not allow since submit() is the function in javascript. And in your code submit is also the name of the element (<input type='submit' name='submit' value='Create Workflow' />) in the form.

change the name of the button to anything else than submit (for eg: submit1) and it will work successfully

Also no need to us setTimeout simply use the following code

function setStep()
    {
        document.forms["reviewForm"].step.value = 3;
                document.reviewForm.submit();
    }

Upvotes: 7

MaVRoSCy
MaVRoSCy

Reputation: 17849

document.getElementById('step').value='3';
document.getElementById('reviewForm').submit();

UPDATE

Upvotes: 2

RandomDuck.NET
RandomDuck.NET

Reputation: 490

Try document.getElementById('step').value = 3 instead of document.forms["reviewForm"].step.value = 3;.

Upvotes: 1

Related Questions