how to load a input box with value using jqueryLearning Curve- Perfect Tutorial for the beginers | Learning Curve- Perfect Tutorial for the beginers

Dynamic updation of textbox value using jquery and php

If you click on the Refresh link in the index.php files jquery will load the textbox value as a dynamic content index.php

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#display_box").load("load_data.php");
$("#refresh_button").click(function(){

$("#display_box").load("load_data.php");

});
 

 });

</script>
</head>
<body>
<div id="refresh_button" name="refresh_button">Refresh</div>
<div id="display_box"></div>
</body>
</html>

<!DOCTYPE html>

<html>

<head>

$(document).ready(function(){

$("#display_box").load("load_data.php");

$("#refresh_button").click(function(){

$("#display_box").load("load_data.php");

});

</script>

</head>

<body>

<div id="refresh_button" name="refresh_button">Refresh</div>

</body>

</html>

load_data.php

<script>
 var type_of_chars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";
 var length_needed = 8;
 var generated_string = '';
 for (var i=0; i<length_needed; i++) {
  var random_num = Math.floor(Math.random() * type_of_chars.length);
  generated_string += type_of_chars.substring(random_num,random_num+1);
 }
    $("#name").val(generated_string);
    $("#country").val(generated_string);
    $("#state").val(generated_string);
    $("#city").val(generated_string);
</script>
<div style="background-color:#DADADA;width:243px;height:118px;padding:24px">
Name:    <input type="text" value="" id="name"> <br/>

Country: <input type="text" value="" id="country"><br/>

State:   <input type="text" value="" id="state"><br/>

City:     <input type="text" value="" id="city"><br/>
</div>
<br/>
<div style="background-color:#DADADA;width:243px;height:118px;padding:24px">
static content<br/>
static content<br/>
static content<br/>
static content<br/>
static content<br/>
static content<br/>
</div

var type_of_chars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";

var length_needed = 8;

var generated_string = '';

for (var i=0; i<length_needed; i++) {

var random_num = Math.floor(Math.random() * type_of_chars.length);

generated_string += type_of_chars.substring(random_num,random_num+1);

}

$("#name").val(generated_string);

$("#country").val(generated_string);

$("#state").val(generated_string);

$("#city").val(generated_string);

</script>

Name: <input type="text" value="" id="name"> <br/>

Country: <input type="text" value="" id="country"><br/>

State: <input type="text" value="" id="state"><br/>

City: <input type="text" value="" id="city"><br/>

</div>

<br/>

static content<br/>

</div