Jquery search in json code example

Example 1: Jquery search in json

$(function() {
    var json = {
        "people": {
            "person": [{
                "name": "Peter",
                "age": 43,
                "sex": "male"},
            {
                "name": "Zara",
                "age": 65,
                "sex": "female"}]
        }
    };
    $.each(json.people.person, function(i, v) {
        if (v.name.search(new RegExp(/peter/i)) != -1) {
            alert(v.age);
            return;
        }
    });
});

Example 2: Jquery search in json

<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.1.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script type="text/javascript">
        function process() {
        	$.getJSON("http://www.mysite.com/json1.json"){
        		$each(function(key,val){
        			if ($("#text1").val()="thefirstname" && key="first"){
	        	            $("#firstname").val(key.first);
		                    $("#lastname").val(key.last);
		                    $("#description").val(key.desc);
			         }
			});
	      	});
        }
    </script>
      <form name="myform" action="jQueryJson.htm">
	    <input type="text" name="text1" value="thefirstname" size="30" />                    <tr><td align="center" colspan="3">
<input type="button" name="search" value="Search for FirstName" size="50" onclick="process" /></td><td align="center"></td><td align="center">
</td></tr>
<input type="text" name="firstname" value="" size="4"/></td><td align="center">
<input type="text" name="lastname" value="" size="4"/></td><td align="center">
<input type="text" name="description" value="" size="4"/>
	</form>

Example 3: Jquery search in json - Get json data

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        $.getJSON("json1.json", function(result){
            $.each(result, function(i, obj){
                $("div").append(obj.first + " " + obj.last + " " + obj.desc + " " + "<br>");
            });
        });
    });
});
</script>
</head>
<body>

<button>Get JSON data</button>

<div></div>

</body>
</html>

Tags:

Javascript Example

Recent Posts