Mike
Mike

Reputation: 297

jquery submit - change input value before post

I am trying to change the value of an input textbox before submitting a form using something like the following:

$('#form1').submit(function () {
     $('#MyTextBox').val('test');
});

However, when debugging the btnSubmit_Click method on the server side, both Request.Form[MyTextBox.UniqueID] and MyTextBox.Text contain the "old" value of #MyTextBox. It appears that the form is being submitted before the javascript completes running. Any idea why this is happening? The javascript definitely runs because if I add an alert, it pops up. If instead of using the form submit function, I use the click button, it works and the new value gets posted to the server:

$('#btnSubmit').click(function () {
     $('#MyTextBox').val('test');
});

The submit button is defined as:

<asp:Button ID="btnSubmit" runat="server" CausesValidation="True"
Text="Submit" OnClick="btnSubmit_Click" ValidationGroup="submitRequest" />

Also on a separate note, is it better practice to use Request.Form[MyTextBox.UniqueID] or MyTextBox.Text in the server side method or does it not matter?

Upvotes: 4

Views: 19307

Answers (6)

user2939347
user2939347

Reputation: 31

You should not use submit() in the onSubmit() function handler. Just do what you want to do and "return true" will submit the form:

(On document ready)

$('#yourform').submit(function()
            {
                $("#yourInputYouWantTochange").prop('checked', true); //If radio or checkbox
                $("#yourInputYouWantTochange").val('whatever'); //If something else
                return true;                
            });

Upvotes: 0

Omar
Omar

Reputation: 1

Make sure the element ( input ) that you want to change is not disabled, if it is disabled then the original value will be sent but if it is enabled the new value will be sent in the post.

Upvotes: 0

Onur Yıldırım
Onur Yıldırım

Reputation: 33634

This should do it:

$('#form1').one('submit', function(event) 
{
    event.preventDefault();
    $('#MyTextBox').val('test');
    $('#form1').submit();
});

let me know..

Upvotes: 0

ShankarSangoli
ShankarSangoli

Reputation: 69905

You might have some javascript error on the page load. Make sure there are no js errors and below code in executed on page load.

$(function(){

    $('#MyForm').submit(function ()
    {
        $(this).find('input[name="q"]').val('test');
        return true;
    });

});

Upvotes: 0

Jess
Jess

Reputation: 8700

I'm not sure what this has todo with asp.net, but this jquery works fine for me: http://jsfiddle.net/pTuL5/.

$('#MyForm').submit(function ()
{
    $('#MyForm input[name="q"]').val('test');
    $('#MyForm').submit();
    return false;
});

Tell me how it goes

Upvotes: 4

Ernestas Stankevičius
Ernestas Stankevičius

Reputation: 2493

Simple solution, but dont set button type "submit".

function submitButton() {
    $('#field').val('sdasdasd');
    $('#form').submit();
    return false;
}

And if using your way, but I dont think it will work.

$('#form1').submit(function () {
    $('#MyTextBox').val('test');
    $('#fomr1').submit();
    return false;
}

Upvotes: 0

Related Questions