Getting value of textbox onchange in javascript

Question

<!DOCTYPE html>
<html>
<head>
  <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
  <style type="text/css">
    #slider { margin: 10px; }
  </style>
 <input type="text" value="" id="rateToPost"/>
<script type="text/javascript">
     var my = document.getElementById("rateToPost").onchange();
     alert(my);
</script>
  <div style="width:75px;height:48px;">
  <div style="width: 5px;margin-left: 10px;">1</div>
  <div style="width: 5px;margin-left: 38px;margin-top: -10px;">2</div>
  <div style="width: 5px;margin-left: 70px;margin-top: -13px;">3</div>
  <div style="width: 5px;margin-left: 98px;margin-top: -12px;">4</div>
  <div style="width: 5px;margin-left: 124px;margin-top: -12px;">5</div>
  </div>

  <script>
  $(document).ready(function() {
    $("#slider").slider({
                range: "min",
                value: 2,
                min: 1,
                max: 5,
    //this gets a live reading of the value and prints it on the page
                slide: function( event, ui ) {
                    $( "#ratingResult" ).text( ui.value );
                },
//this updates the value of your hidden field when user stops dragging
            change: function(event, ui) { 
                $('#rateToPost').attr('value', ui.value);
            }});
  });
  </script>

</head>
<body style="font-size:62.5%;">
<div id="slider"></div>
</body>
</html>

In the above script I used a slider for rating. But what is the problem here is I have to fetch the text box value onchange and highlight the corresponding rating number background. But I cant fetch the value. Anyone can help to solve thisproblem. Thanks in advance

palaѕн · Accepted Answer · 2013-01-15 13:10:08Z

8

Try this using jQuery:

$('#rateToPost').on("change", function () {
  alert($(this).val());
});

answered Jan 15, 2013 at 13:10

palaѕн

74.2k17 gold badges123 silver badges140 bronze badges

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

1 Comment

Rithu Over a year ago

Can't fetch the value using the jquery function

Johan · Accepted Answer · 2013-01-15 13:05:23Z

3

Since $('#rateToPost') is a form element: Use the val() method.

answered Jan 15, 2013 at 13:05

Johan

35.4k62 gold badges191 silver badges309 bronze badges

Comments

Anton · Accepted Answer · 2013-01-15 13:07:01Z

1

 $('#rateToPost').keyup(function(){
       $('#slider').slider({value: this.value});
    });

Demo http://jsbin.com/azosab/2/edit

answered Jan 15, 2013 at 13:07

Anton

32.6k5 gold badges47 silver badges54 bronze badges

2 Comments

Rithu Over a year ago

Anton Over a year ago

here, you need to add document.ready on that script jsbin.com/azosab/6/edit

General Grievance · Accepted Answer · 2023-05-15 21:03:40Z

1

assign value:

$('#rateToPost').val(ui.value);

read value:

var res = $('#rateToPost').val();

edited May 15, 2023 at 21:03

General Grievance

5,12039 gold badges39 silver badges60 bronze badges

answered Jan 15, 2013 at 13:04

Andy

512 bronze badges

Collectives™ on Stack Overflow

Getting value of textbox onchange in javascript

4 Answers 4

1 Comment

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related