Situation summary:
I have a search function in javascript that uses a drop down menu and textfield values from my html. It sends the values to my php and the second javascript function displays the results in a table.
The problem I am facing is that it shows the results for a split second then it seems to reload and it clears. I have an alert that pops up and when it pops up I can see the results, once I click ok then it clears.
Heres my HTML:
Here is my Javascript functions:
Didn't think I'd need to post the PHP since it seems to be pulling the correct info..
I have a search function in javascript that uses a drop down menu and textfield values from my html. It sends the values to my php and the second javascript function displays the results in a table.
The problem I am facing is that it shows the results for a split second then it seems to reload and it clears. I have an alert that pops up and when it pops up I can see the results, once I click ok then it clears.
Heres my HTML:
HTML:
<body>
<div id="search">
<p> </p>
<table width="400" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<th scope="col"> CARD SEARCH ENGINE</th>
</tr>
</table>
<table width="408" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<th align="center" scope="col">
<form method="post" name="searchcard">
<br />
Search:
<select name="card_search" id="card_search">
<option value="0">Pick search item</option>
<option value="1">First Name</option>
<option value="2">Last Name</option>
<option value="3">Brand</option>
</select>
<input type="text" name="search_field" id="search_field" />
<input type="submit" value="Get" onclick="search_data()"/>
</form> </th>
</tr>
</table>
<p></p>
<p> </p>
<div id="cards_div">
</div>
</div>
</body>
Here is my Javascript functions:
Code:
var new_search=1;
var new_searchadded=1;
function search_data(new_search,new_searchadded)
{
var card_search = document.searchcard.card_search;
if (card_search.value == 2)
{
var search_text = document.getElementById("search_field").value;
if(search_text != "")
{
xmlDoc.load("get_fields.php?search_field="+search_text);
read_data();
alert("worked");
}
}
else
{
parent.search_card.document.getElementById("cards_div").innerHTML = "";
}
}
function read_data(id)
{
var card_html = '</br></br><label><table width="300" border="1" align="center"><tr><td><b>Player Name</b></td><td><b>Brand Name</b></td><td><b>Year</b></td><td><b>Stock</b></td><td><b>Add Stock</b></td><td><b>Sold Stock</b></td></tr>';
var cardsNode = xmlDoc.getElementsByTagName("cards");
var cardsList = cardsNode[0].getElementsByTagName("card");
for(var i = 0; i < cardsList.length; i++)
{
var name = cardsList[i].getElementsByTagName("First")[0].firstChild.nodeValue;
var name2 = cardsList[i].getElementsByTagName("Last")[0].firstChild.nodeValue;
var brand = cardsList[i].getElementsByTagName("Brand")[0].firstChild.nodeValue;
var card_id = cardsList[i].getElementsByTagName("card_id")[0].firstChild.nodeValue;
var stocks = cardsList[i].getElementsByTagName("stock_num")[0].firstChild.nodeValue;
var year = cardsList[i].getElementsByTagName("Year")[0].firstChild.nodeValue;
card_html += '<tr><td><b>'+name+'</b> <b>'+name2+'</b></td><td><b>'+brand+'</b></td><td><b>'+year+'</b></td><td><b>'+stocks+'</b></td>';
card_html += '<td><label><input type="button" name="button2" id="button2" value="Add Stock" onclick="add_stock('+card_id+')"/></label></td>';
card_html += '<td><label><input type="button" name="button2" id="button2" value="Sold Stock" onclick="sold_stock('+card_id+')"/></label></tr>';
}
if(cardsList.length == 0)
{
card_html += '<tr><td>No Results</td></tr>';
}
card_html += '</table></label>';
document.getElementById("cards_div").innerHTML = card_html;
}
Didn't think I'd need to post the PHP since it seems to be pulling the correct info..