javascript - How do I show an external JS function (returns array) into a html list -


i developing mobile application. need show array in list on html. have function in external .js file returns array json data retrieved.

this function in javascript:

function getnames() {   var url = api + "/name";   $.getjson(url).done(function (answer) {     if (!answer.length) {       console.warn("empty list");     }     api.name = response;     (i = 0; < response.length; i++) {       $('#names').html(api.name[i].name);     }    }).fail(function (data, status, error) {     console.error("something went wrong");   }); }

this html list want them displayed in:

<div>   <div class="widget-container">     <div class="list-group">       <a>         <h4 id="names">           <script type="text/javascript">             window.onload = function () {               getnames();             };           </script>         </h4>       </a>       repeated 4 times.i have 4 headings meaning need 4 names            array returns     </div>   </div> </div>

the list display them in menu panel. code have shows me last name reason.

if understand correctly, want generate h4 tag each of array elements.

some issues in code:

  • there no use in putting script tag @ place want inject data. place before closing </body> tag or else in <head> tag;
  • don't use window.load. there specific cases useful, not in case. instead use domcontentloaded event, or, use jquery, equivalent .ready() method;
  • you name json response argument answer, start referring response: should stick same variable name;
  • you assign multiple times html same element #names, overwrite previous value , left last value only;
  • you use html method argument pure text. not advised, can problems text contains < or & characters, have special meaning in html. instead should use .text();
  • you use api variable in strange ways. first seems string (in url = api + "/name"), , later assign name property. although can work, makes code obscure. if object, first statement equal url = api.tostring() + "/name";
  • the code never adds h4 element, seems want. happen generate necessary h4 elements dynamically.

here code adapted accordingly, makes use of fake json provider:

var api = 'https://jsonplaceholder.typicode.com';    function getnames() {    var url = api + "/posts"; // change "/name"    $.getjson(url).done(function (response) {      if (!response.length) {        console.warn("empty list");      }      $.map(response, function(item) {        $('.list-group').append($('<h4>').text(item.title)); // change item.name      });    }).fail(function (data, status, error) {      console.error("something went wrong");    });  }    $(function() {      getnames();  });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>  <div>    <div class="widget-container">      <div class="list-group">      </div>    </div>  </div>


-

Comments

Post a Comment

Popular posts from this blog

c++ - CPP, 'X' button listener -

i'm writing cpp program, , want execute function when 'x'(shut down) button pressed. for example, have infinite loop prints same thing everytime iterates, until 'x' button pressed, , want execute function before process ends. is there kind of listener matter? or other solution maybe (like delaying process shut down few seconds or something)? thanks! if want execute before process ends, can register std::atexit handler. function called before process exits.
Read more

shared memory - gstreamer shmsrc and shmsink with h264 data -

i trying share h264 encoded data gstreamer 2 processes(both based on gstreamer).after research way found use shm plugin. trying do gstreamer--->h264 encoder--->shmsink shmrc--->process1 shmrc--->process2 i able raw data videotestsrc , webcam working. h264 encoded data doesn't. test pipeline gst-launch-1.0 videotestsrc ! video/x-raw,width=640,height=480,format=yuy2 ! x264enc ! shmsink socket-path=/tmp/foo sync=true wait-for- connection=false shm-size=10000000 gst-launch-1.0 shmsrc socket-path=/tmp/foo ! avdec_h264 ! video/x- raw,width=640,height=480,framerate=25/1,format=yuy2 ! autovideosink have tried shm plugins h264 encoded data, please help iam not aware of capabilities of sink used in "autovideosink", per knowledge either need use videoconvert if format supported sink (like kmssink or ximagesink) different provided source (in case yuy2) or use videoparse if camera format supported sink. may check using gst-inspect-1...
Read more

.net - Bulk insert via Dapper is slower than inserting rows one-by-one -

i'm using dapper insert data realtime feed sql server, care performance. recently, noticed strange. out of box, if give dapper collection , insert query, fires insert statements each element. tests show can insert 1800 objects 12 fields in 1 second way (counting connection.execute(...) running time. now, didn't find batch insert functionality in dapper , implemented own (constructing parameter list , sql query). after that, found out can insert 1 batch in 3 seconds (which limited 1000 rows) (again, counting connection.execute(...) calls. so, makes batching 6 times slower sending each row in separate query. can explain me? thought people use batch operations speed process. insert time 1 second @ most. use sql server 2012 standard on local network. table i'm inserting has clustered index on primary key (which bigint field), no non-clustered indexes , triggers. can post code, there's nothing special i'm not sure why using dapper execute extension ...
Read more