में जावास्क्रिप्ट और प्रदर्शन परिणामों के साथ एक्सएमएल खोजें मेरे पाठ्यक्रम के लिए, मुझे एक HTML पृष्ठ बनाने के लिए कहा गया है जिसमें उपयोगकर्ता को संपर्क के पहले नाम में प्रवेश करने की अनुमति देने की कार्यक्षमता है, जो ऑनसमेट करता है, एक एक्सएमएल फ़ाइल लोड करता है I पहले बनाया गया था, जब तक यह उपयोगकर्ता द्वारा दर्ज किए गए पहले नाम से मेल नहीं खाता तब तक संपर्कों के माध्यम से loops, और उसी पते पर, ईमेल पते को छोड़कर, एक ही पृष्ठ पर, संपर्क विवरण प्रदर्शित करता है और <h1> प्रदर्शित करता है संपर्क विवरण:। यदि कोई मिलान नहीं है, तो <h2> होना चाहिए जो कहता है कि संपर्क मौजूद नहीं है।तालिका
<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/xsl" href="Contact.xsl" ?>
<!DOCTYPE contact SYSTEM "contact.dtd">
<contact>
<person>
<name>
<firstname>Bob</firstname>
<lastname>Jones</lastname>
</name>
<phone>(02)44 42 45 63</phone>
<address>
<street>34 Highway Road</street>
<city>Grovedale</city>
<state>NSW</state>
<postcode>3228</postcode>
<email>[email protected]</email>
</address>
</person>
<person>
<name>
<firstname>Gary</firstname>
<lastname>Williams</lastname>
</name>
<phone>(02)44 41 87 56</phone>
<address>
<street>223 Yarra Avenue</street>
<city>Branston</city>
<state>NSW</state>
<postcode>2317</postcode>
<email>[email protected]</email>
</address>
</person>
मैं कुछ चीजें की कोशिश की है, लेकिन मैं पता नहीं कैसे मैं डेटा किसी तालिका में प्रदर्शित करने के लिए मिल जाएगा:
निम्नलिखित मेरी एक्सएमएल फ़ाइल है। निम्नलिखित मेरी एक्सएसएल फाइल है जो मुझे लगता है कि वे टेबल को दिखाना चाहते हैं, लेकिन खोज के परिणामों के साथ।
<?xml version="1.0" encoding="ISO-8859-1"?><!-- DWXMLSource="Contact.xml" -->
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<head>
<style>
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
}
div {
margin-left: 150px;
margin-right: 20px;
margin-top: 50px;
width: 80%;
}
h1 {
font-size: 24px;
color: #F00;
}
.headings {
background-color: #06F;
}
.data {
background-color: #6F9;
}
.table {
border: 2px solid #F00;
width: 100%;
}
</style>
</head>
<body>
<div>
<h1>CONTACTS</h1>
<table class="table">
<tr class="headings">
<th>First Name</th>
<th>Last Name</th>
<th>Street</th>
<th>City</th>
<th>State</th>
<th>Postcode</th>
<th>Email</th>
</tr>
<xsl:for-each select="contact/person">
<tr class="data">
<td><xsl:value-of select="name/firstname"/></td>
<td><xsl:value-of select="name/lastname"/></td>
<td><xsl:value-of select="address/street"/></td>
<td><xsl:value-of select="address/city"/></td>
<td><xsl:value-of select="address/state"/></td>
<td><xsl:value-of select="address/postcode"/></td>
<td><xsl:value-of select="address/email"/></td>
</tr>
</xsl:for-each>
</table>
</div>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
मुझे XML फ़ाइल को खोजने और खोज से परिणामों को प्रदर्शित करने वाली तालिका बनाने के लिए जावास्क्रिप्ट का उपयोग करना होगा।
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Task 2</title>
<script language="JavaScript" type="text/javascript">
window.onload = loadIndex;
function loadIndex()
{
if (document.implementation && document.implementation.createDocument)
{
xmlDoc = document.implementation.createDocument("", "", null);
xmlDoc.load("Contact.xml");
}
else if (window.ActiveXObject)
{
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async = "false";
xmlDoc.load("Contact.xml");
}
}
function searchIndex()
{
if (!xmlDoc)
{
loadIndex();
}
var searchterm = document.getElementById("searchme").value;
var allitems = xmlDoc.getElementsByTagName("firstname");
results = new Array;
for (var i=0;i<allitems.length;i++)
{
var name = allitems[i].lastChild.nodeValue;
var exp = new RegExp(searchterm,"i");
if (name.match(exp) != null)
{
results.push(allitems[i]);
}
}
showResults(results, searchterm);
}
function showResults(results, searchterm)
{
//insert table data here to be displayed
}
</script>
</head>
<body>
First Name: <input type="text" name="firstname" id="searchme">
<br />
<input type="submit" value="Search" onClick="searchIndex(); return false;">
</body>
</html>
आप देख सकते हैं, मैं कहाँ शुरू करने के लिए पता नहीं है:
एचटीएमएल मेरे पास है इस प्रकार है। मुझे पता है कि मैं एक्सएमएल फ़ाइल लोड करूंगा, फिर पहला नाम टैग इकट्ठा करूंगा, फिर किसी भी तरह से दो की तुलना करें और फिर परिणाम प्रदर्शित करें।
मैंने निम्नलिखित को देखा है, और यह मेरे जैसा ही है, लेकिन मैं परिणामों को तालिका में प्रदर्शित करने के लिए नहीं मिल सकता। http://www.dzone.com/snippets/simple-javascriptxml-based
सहायता के लिए धन्यवाद।
फ़ंक्शन 'searchIndex' कहां है? –
इस समय कहीं भी नहीं। जैसा मैंने कहा। मुझे नहीं पता कि कहां से शुरू करना है। मैं ऊपर जो कुछ सोचता हूं उसे संपादित करें। – Curley5959
कोड अपडेट किया गया। – Curley5959