My project is to create a webpage to search mobile gadgets on a website(www.mudah.my), and I want the result to be shown on my own webpage, but NOT redirecting me to www.mudah.my. May I know is that possible to do that? I've ask around and people told me that I can use Ajax, but I totally don't know how to implement it since I have 0 knowledge on it and I'm lack of time to learn from scratch. Below are my code to search items.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Seller Evaluation System</title>
<style type="text/css">
body {background-image:url("images.jpg");}
</style>
</head>
<body>
<!-- first, use ajax to load the page. then use jquery dom manipulation.
1. find the div that holding all the ads
2. extract the entire div into variable
3. replace all the mudah footprint
4. populate the entire div into your own page. -->
<h1><center>Seller Evaluation System<center></h1>
<p><center>
<script>
function searchSite(){
var input=document.getElementById("searchinput").value;
var searchForm=document.getElementById("searchForm");
searchForm.action="http://www.mudah.my/Malaysia/Electronics-3000/"+input+"-for-sale?lst=0&fs=1&q="+input+"y&cg=3000&w=3&so=1&st=s";
searchForm.submit();
}
</script>
<!--<script>
function displayResult(){
$.ajax({
url: searchForm.action,
dataType: 'text',
success: function(data) {
var elements = $("<div>").html(data)[0].getElementsByTagName("ul")[0].getElementsByTagName("li");
for(var i = 0; i < elements.length; i++) {
var theText = elements[i].firstChild.nodeValue;
// add code to populate the div into my page
}
}
});
} -->
</script>
<form method="get" action="" id="searchForm">
<input type="text" id="searchinput" size="33" placeholder="Search Electronic Gadgets..." autofocus>
<button onclick="searchSite()">Search</button>
<!--<iframe src="http://www.mudah.my/Malaysia/Electronics-for-sale-3000" width="600" height="600"></iframe> -->
</form>
<p><label>Mudah<input type="checkbox" name="searchFrom" value="Mudah" checked/></label>
<label><font color="grey">Lazada</font><input type="checkbox" name="searchFrom" value="Lazada" disabled="disabled"/></label>
<label><font color="grey">Lelong</font><input type="checkbox" name="searchFrom" value="Lelong" disabled="disabled"/></label>
<label><font color="grey">Ebay</font><input type="checkbox" name="searchFrom" value="Ebay" disabled="disabled"/></label></p>
</center></p>
</br>
</body>
</html>