Javascript set input value when user click button

Question

Im developing chrome extension. I want to change input value(username) to some text when user click button. But my solution not working. Need advise. My code is shown below:

<!DOCTYPE html>
<html>
<head>  
<META http-equiv=content-type content=text/html;charset=utf8>
<META http-equiv=content-type content=text/html;charset=windows-1254>
<META http-equiv=content-type content=text/html;charset=x-mac-turkish>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>  
<title></title>
<script>
    $('#target').submit(function() {
    alert('something');
    return false;
    $('#UserName').value('test');
});
</script>
</head>
<body>
<form id="target">
<table>
  <tr>
    <td>UserName:</td>
    <td>
      <input type="text" id="UserName" size="20" />
    </td>
  </tr>
  <tr>
    <td>Password:</td>
    <td>
      <input type="password" id="Password" />
    </td>
  </tr>
  <tr>
    <td></td>
<td><input type="button" value="Login" id="Login" /></td>
  </tr>
</table>
</form>
</body>
</html>

rkatka · Accepted Answer · 2013-07-18 13:54:46Z

2

Change your submit button from type button to submit from:

 <input type="button" value="Giriş" id="Login" />

to:

<input type="submit" value="Giriş" id="Login" />

Also change your JS code from:

$('#target').submit(function() {
alert('uyarı');
return false;
$('#UserName').value('deneme');

to:

$('#target').submit(function() {
 alert('uyarı');    
 $('#UserName').val('deneme');
 return false;

answered Jul 18, 2013 at 13:54

rkatka

566 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

ftdeveloper Over a year ago

Tried but nothing changed except form refreshing.

pmandell · Accepted Answer · 2013-07-18 13:57:02Z

2

Your submit button needs to be of type 'submit'.

So this:

<input type="button" value="Login" id="Login" />

should be:

<input type="submit" value="Login" id="Login" />

Also, the appropriate jQuery function for getting/setting input values is .val().

Lastly, you don't want to return false until the end of the function.

$('#target').submit(function() {
    alert('something');      
    $('#UserName').val('test');
    return false;
});

See this working Fiddle.

edited Jul 18, 2013 at 13:57

answered Jul 18, 2013 at 13:47

pmandell

4,31820 silver badges21 bronze badges

3 Comments

ftdeveloper Over a year ago

I looked in fidlle. Yes it works. But In my extension it doesnt work.

pmandell Over a year ago

Are you getting any JavaScript errors in your console? The above could is the correct way to complete the tasks you specified using jQuery.

ftdeveloper Over a year ago

I am developing chrome extension. When i open my html in browser all is fine and works. But when i install my extension into chrome nothing works. I clicked button to many times but it is refreshing page only there is no alert no error.

Akbar · Accepted Answer · 2013-07-18 14:04:27Z

1

This is working fine

$('input#Login').click(function() {        
    $('#UserName').val('test');
    return false;
});

answered Jul 18, 2013 at 14:04

Akbar

1013 bronze badges

Comments

score 1 · Accepted Answer · 2013-07-18 14:06:02Z

1

jQuery uses the VAL rather than VALUE

in other words

<script>
    $('#target').submit(function() {
    alert('something');
    return false;
    $('#UserName').val('test');
});
</script>

and also the FORM is not submitado change the type of input and submit to the adciona FORM METHOD = "POST"

edited Jul 18, 2013 at 14:06

answered Jul 18, 2013 at 13:58

user2188149

3 Comments

ftdeveloper Over a year ago

Thanks for answer but still nothing changed

user2188149 Over a year ago

@pale changed the response of a look

ftdeveloper Over a year ago

I am developing chrome extension. When i open my html in browser all is fine and works. But when i install my extension into chrome nothing works. I clicked button to many times but it is refreshing page only there is no alert no error. But when open in browser everythings works fine.

ftdeveloper · Accepted Answer · 2013-07-19 08:29:26Z

0

Guys thank you very much. I found. The problem is when you are developing google chrome application you must seperate javascript code from html. Otherwise javascript not work.

answered Jul 19, 2013 at 8:29

ftdeveloper

1,0933 gold badges26 silver badges51 bronze badges

Collectives™ on Stack Overflow

Javascript set input value when user click button

5 Answers 5

1 Comment

3 Comments

Comments

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

1 Comment

3 Comments

Comments

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related