2016-12-28 6 views
2

Я пытаюсь отобразить результат запроса после того, как пользователь нажал submit со значением, которое они ввели, запрос предназначен для захвата этого input и генерации результата, специфичного для ввода. Запрос выполняет захват ввода, поскольку я поставил код запроса в поле предупреждения, и он отображает input от пользователя в запросе, это окно оповещения появляется после нажатия submit. Мой код ниже:Получить запрос 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

<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, чтобы получить более знакомое понимание. Итак, вопрос прямо сейчас после подачи ничего не отображается, кроме предупреждения, отображающего ввод пользователя.

Спасибо за ваше время :)

+0

Вы проверили консоль, что получаете данные? и почему вы используете jsonp? из-за CORS? Я думаю, что json должен работать здесь. Я использую json для получения информации из Wikidata. – Alexan

+0

Да, он говорит только недостижимый код в console.log и любые полезные ссылки для json? Я использую DBPedia для извлечения информации. –

+0

просто измените jsonp на json и запустите консоль – Alexan

ответ

1

Так мне удалось решить проблему и получить результат ... все, что я должен был сделать вставки элементов формы в таблице как:

<table id="results"> 

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

</table> 

Однако это очень странно, потому что, когда я пытаюсь ввести теги form, это не работает: S по крайней мере он делает то, что я хочу, чтобы он делал сейчас :)

Смежные вопросы