views:

31

answers:

4

I want users to enter something in an text field, press OK and then run a function on the value of that text.

I have been looking at jQuery docs, I found keyup which gets the value instantly (not what I want) and the only things I can find about doing stuff with submitted form data involve POSTing the results to a php file or something.

I am keen to learn so if you could post links to resources where I could find out more along with your answer I would be most grateful. Thanks.

A: 

If you want to work on the value of the form, without submitting the form:

$('form#formId').submit(
    function() {
        var inputText = $('input#inputText').val();
        //do something with inputText

        return false; // prevent the form being submitted to the server
    }
);

A link to the jQuery docs for forms.

David Thomas
A: 

if your ok button is submit button of a form then you are looking for a jQuery/javascript onsubmit event it happen when the submit button is clicked. On this event you can trigger a function which does your calculations.

<form action='' onsubmit='abc()'>


function abc()
{
......
}

http://api.jquery.com/submit/

sushil bharwani
A: 

You can catch the submit with the jQuery submit() function

<form id="target" action="destination.html">
  <input type="text" value="Hello there" />
  <input type="submit" value="Go" />
</form>
<script>
$('#target').submit(function() {
  alert('Handler for .submit() called.');
  return false;
});
</script>
sod
+1  A: 

You don't need a <form> for this (if you're not sending any data anywhere), just a set of <input> elements will do, for example:

<input id="myInput" type="text" />
<input id="myButton" type="button" value="Click me!" />

And jQuery like this:

$("#myButton").click(function() {
   myFunction($("#myInput").val());
});

You can test it out here, all we're doing is attaching a handler to the button via .click() and getting the value from the textbox via .val()...and then using that however you want, in this case passing it as a parameter to the function.

Nick Craver
I want to use jQuery translate as my function. I've used your code, what I want to do is display the translated word below the text input, but I'm not sure a) how to properly grab the value and b) how to dictate where the translation will be injected. http://jsfiddle.net/4r3Pc/1/ Thanks.
Sean McRaghty
@Sean - I'm not sure what your translation function is, but if say it took a value and returned the translation it'd look something like this: http://jsfiddle.net/nick_craver/BcFDF/ It can be condensed down, but trying to illustrate what's happening.
Nick Craver
@Nick Here is the doc http://code.google.com/p/jquery-translate/wiki/TranslateMethod. If I understand correctly, the function gets the translation input from a DOM element, hence I am having trouble telling it that is the 'val' I want to translate. Thanks for your help.
Sean McRaghty
@Sean - In that case copy the output then call translate, like this: http://jsfiddle.net/nick_craver/8fJ44/
Nick Craver
@Nick - your latest example gives me 'Klick mich!' - it just seems to be translating what's in the button and not what is in the input box!
Sean McRaghty
@Sean - Woops sorry, here's the working version: http://jsfiddle.net/nick_craver/8fJ44/2/ The `.removeData()` call is because the plugin (by default) stores the translation, preventing it from being called again...need to clear that out to make it run each time.
Nick Craver
Great! Thank you so much. Now, is it difficult to let jQuery access that translation? I guess that is a completely different question, so perhaps if there was an easy link, if I need to do anything special? Thanks again.
Sean McRaghty
@Sean - Take a look at the callback options section of the translate method page, you can look over the element and use the text however you need in them :)
Nick Craver