CODEWITHSUNDEEP
javascripthtmlsubmit
user127886
user127886

Reputation: 317

HTML javascript get value from input

How can I use the value of a form field in a confirmation dialog box that is displayed upon submit, as seen below? 

<form action='removefinish.php' method='post' "accept-charset='UTF-8'">
Role: <br>
<select name="role">
<option value="" selected="selected"></option>
<option VALUE="Administrator"> Administrator</option>
<option VALUE="Employee"> Employee</option>
</select>
<br>
<label for='username'>ID: &nbsp;</label>  
<br>
<input type='text' name='username' id='username'/>  
<br>
<br><br>
<input type='submit' name='Submit' value='Submit' onclick="return confirm('Are you sure to remove ID: ')";/>

Upvotes: 0

Views: 20819

Answers (5)

jeffjenx
jeffjenx

Reputation: 17467

You could return confirm('Are you sure to remove ID: ' + document.getElementById('username').value() ) );"

However, you would probably want to make a function out of that and just return customConfirmFunction( ); to make it easier to read and future-proof it, in case you need to add some more logic to it.

Upvotes: 0

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201588

Replace the onclick attribute by the following:

onclick="return confirm('Are you sure to remove ID ' +
   document.getElementById('username').value + '?')"

Upvotes: 2

Nimphious
Nimphious

Reputation: 5039

You need to hook into the form's submit event.

In your case, you need to give your form element an ID, in this example we give it the id formID

<form id="formID" action="removefinish.php" method="post" "accept-charset='UTF-8'">

Then, you hook into the form's event like this:

function formHook() {
    document.getElementById('formID').addEventListener('submit', function(e) {
        // This will fire when the form submit button is pressed,
        // or when the user presses enter inside of a field.

        // Get the value from the username field.
        var value = document.getElementByID('username').value;

        // Ask the user to confirm.
        if (!confirm('Are you sure you wish to remove ' + value + ' from the database?')) {
            // Stop the form from processing the request.
            e.preventDefault();
            return false;
        }
    }, false);
}

You need to do this after the document has loaded, to make sure javascript can find the form, rather than look before it's been added to the DOM. To do this, you can simply use something like this:

window.addEventListener('load', formHook, false);

And now, when the document has finished loading, the formHook function will be called.

Upvotes: 1

Abhishek Singh
Abhishek Singh

Reputation: 6166

You can do something like this :-

    <script type="text/javascript">
    var valueText=document.getElementById("username");
    function confirmPopUp()
    {
    var bul=confirm("Are you sure to remove ID"+valueText.value);
    if(bul==true)
    {
    //statements
    }
    else
    {
    //statements
    }
    }
</Script>

Upvotes: 0

Jelly
Jelly

Reputation: 111

If you don't wanner go to another page, you can use ajax, or set your form action to the same request php file.

Upvotes: 0

Related Questions