简体   繁体   中英

How to read values from properties file with html

Below is my html snippet

First name:
<input type = "text" >
Last name:
<input type = "text">

Instead of hard coding the field values (First name,Last name) in the html I want to read them from a property file is this possible just with html.please suggest me a way to do it.

You can read a file using ajax(XMLHttpReqeust).

with no plugins:

First name:
<input id="first_name" type="text">
Last name:
<input id="last_name" type="text">
<script>
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
  if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
    var data = xmlhttp.responseText; // use JSON.parse if properties file is formatted as json
    document.getElementById('first_name').value = data; // use like this
    }
  }
xmlhttp.open("GET", "properties.txt", true);
xmlhttp.send();
</script>

Just put a file in the same folder as the html and load it with JQuery ajax:

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
</head>
<body>
<input type="text" id="name" />
<input type="text" id="last_name" />
<script>
$(function(){
$.ajax({
    url:'config.json',
    type:'GET',
    success:function(data){
        var tmpData = JSON.parse(data);
        $("#name").val(tmpData.name);
        $("#last_name").val(tmpData.last_name);
    }
});
});
</script>
</body>
</html>

config.json

{
    "name": "John",
    "last_name": "Doe"
}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM