獲取SPARQL查詢顯示在Javascript

提交我想以後用戶按下與他們輸入的值提交給顯示查詢結果後，查詢旨在抓住這個input並生成特定的輸入結果。查詢不搶輸入，因爲我已經把查詢代碼在一個警告框，並將其顯示在查詢用戶input，這個警告框按提交課程後彈出。我的代碼都低於：獲取SPARQL查詢顯示在Javascript

的Html

<table id="results"> 
    </table> 
    <form> 
     First name:<br> 
     <input id="messageInput" type="text" name="firstname"><br> 
     <input id="submit99" type="submit" value="Submit"> 
    </form>

查詢結果應在表按提交後顯示。因此插入了table。

腳本

<script type="text/javascript"> 
    var table = $("#results"); 
    table.on("click", "td", myFunction); 
    var url = "http://dbpedia.org/sparql"; 
     $('#submit99').on('click', function (e) { 
      var userInput = $('#messageInput').val(); 
      var query = [ 
      "PREFIX rdfs: <http://www.w3.org/2000/01/rdf-schema#>", 
      "PREFIX type: <http://dbpedia.org/class/yago/>", 
      "PREFIX prop: <http://dbpedia.org/property/>", 
      "SELECT ?spouse", 
      "WHERE {", 
       "?dave dbo:spouse dbr:" + userInput + ".", 
       "?dave rdfs:label ?spouse.", 
       "}", 
      "Limit 1" 
      ].join(" "); 

      alert("this query: [" + query + "]"); 
      var queryUrl = url + "?query=" + encodeURIComponent(query) + "&format=json"; 
      console.log(queryUrl); 
      $.ajax({ 
       dataType: "jsonp", 
       url: queryUrl, 
       success: function (data) { 
        console.log(data); 
        // get the table element 
        var table = $("#results"); 

        // get the sparql variables from the 'head' of the data. 
        var headerVars = data.head.vars; 

        // using the vars, make some table headers and add them to the table; 
        var trHeaders = getTableHeaders(headerVars); 
        table.append(trHeaders); 

        // grab the actual results from the data. 
        var bindings = data.results.bindings; 

        // for each result, make a table row and add it to the table. 
        for (rowIdx in bindings) { 
         table.append(getTableRow(headerVars, bindings[rowIdx])); 
        } 
       } 
      }); 

      function getTableRow(headerVars, rowData) { 
       var tr = $("<tr></tr>"); 

       for (var i in headerVars) { 
        tr.append(getTableCell(headerVars[i], rowData)); 
       } 

       return tr; 
      } 
      function getTableCell(fieldName, rowData) { 
       var td = $("<td></td>"); 
       var fieldData = rowData[fieldName]; 
       //alert("fieldName = ["+fieldName +"] rowData[fieldName][value] = ["+rowData[fieldName]["value"] + "]"); 
       td.html(fieldData["value"]); 
       return td; 
      } 
      function getTableHeaders(headerVars) { 
       var trHeaders = $("<tr></tr>"); 
       for (var i in headerVars) { 
        trHeaders.append($("<th>" + headerVars[i] + "</th>")); 
       } 
       return trHeaders; 
      } 

     }); 
    </script>

當你發現用戶按下提交後，這就是爲什麼我把幾乎所有的代碼在submit99按鈕查詢結果應該顯示在表格中。你們應該能夠通過將代碼複製並粘貼到自己的IDE來運行代碼，以獲得更熟悉的理解。因此，提交後的問題現在沒有任何顯示，除了顯示用戶輸入的alertbox。

感謝您的時間:)

來源

2016-12-28 Jesse Lin

你在你得到的數據控制檯檢查什麼？以及爲什麼你使用jsonp？因爲CORS？我認爲json應該在這裏工作。我使用json從Wikidata獲取信息。 – Alexan

是的它只能說console.log中的無法訪問的代碼，以及json的任何有用的鏈接？我使用DBPedia來檢索信息。 –

只需將jsonp更改爲json並檢入控制檯即可 – Alexan

所以我設法解決這個問題，得到的結果......所有我需要做的就是插入表中的表單元素，如：

<table id="results"> 

    <First name: 
    <br> 
    <input id="messageInput" type="text" name="firstname"> 
    <br> 
    <input id="submit99" type="submit" value="Submit"> 

</table>

但是很奇怪，因爲當我嘗試輸入form標籤它不工作：S ATLEAST它我想它現在要做的:)

來源

2016-12-29 11:27:47

獲取SPARQL查詢顯示在Javascript

回答

相關問題