wikiCamp Wikipedia Viewer 1.0!

Code Feedback
1

Tackled in about 4-5 hours. A percentage of this time was spent working with the custom logo (rusty in PS lol).

Meets the specs so I submitted it.

Future plans:

  • Change code so that search results display in iFrame instead of new tab, like the random button does.

  • Visual Enhancements

2

@TheOnlyRealTodd its the OnlyRealWikiCamp… I love it!:laughing:

1 Like
3

congrats on completing this biplane… LOOKS GREAT… I am working on it now… It is challenging…

I you could offer some advice… I have tried the $.getJSON and $.ajax…
*** I tried to wrap in a click function and set the value of what I wanted to search as a variable (search)…

$(“#Submit”).click(function () {

$(document).ready(function() {

//https://en.wikipedia.org/w/api.php?action=opensearch&limit=5&search=bees&format=json&callback=?";

var url = “MediaWiki API help - Wikipedia”;
var search = $(“#search”).val();
$.ajax({
url: url,
data: {
action: ‘opensearch’,
prop: “info”,
search: search,
format: ‘json’
},
dataType: “jsonp”,
success: function(data) {
console.log(“hello”);
$(“#search2”).append(“hello”);

  }
});

});
});

4

@Docwali777 Thanks and sorry for the delay, didn’t get on here much today.

So, I am a little “JS Rusty” as I’ve been working mainly in C# and CSS the past week or so, but this is what I’m seeing so far:

$("#Submit").click(function () { should not be before $(document).ready(function() {, it should either be after it or you can omit $(document).ready(function() altogether by placing your reference tag at the very bottom of your HTML body. If you’re using CodePen, then just include everything within document.ready.

  1. You are using a different method than I did. I’ll show you what I did below. You may be able to get yours to work somehow, but I can show you what I did that I know works. I just used the plain URL and ran a GET request on it:

    var searchTerm = $("#search").val();
    var url = “https://en.wikipedia.org/w/api.php?action=opensearch&search=” + searchTerm + “&format=json&callback=?”;

Another thing, I think your ajax request may be faulty. This is what I used:

    $.ajax({
    url: url,
    type: 'GET',
    contentType: 'application/json; charset=utf-8',
    async: false,
    dataType: 'json',
    success: function(data, status, jqXHR){

I see that you have tried to pass the search into the data object. I haven’t messed with that, I don’t think it needs to be that complicated. I’ve used mine a lot and it works every time. I also notice your success function looks different than mine, maybe that’s it too.