CODEWITHSUNDEEP
jqueryajaxgo
cmshnrblu
cmshnrblu

Reputation: 111

Ajax newbie learning (golang jquery)

Ok, so I have thoroughly scoured stackoverflow looking for solutions that can make my code work, and I believe I am close, but I cant tell exactly why my code isnt working.

So, I am trying to build a dynamic content page and have an ajax request sent from click onto my notes to allow them to be expanded and viewed, and edited.

Heres the script I am trying to use:

<script>
$('.notes').on('click',function (e){
   alert("ok");
   $.ajax({
    type:'GET',
    url :'localhost:8080/editnote',
    dataType: 'html',
    success: function(data) {
        console.log('success',data);
        $('#interactive').html(data);

    },
    error: function(jqXHR,textStatus,errorThrown ){
       alert('Exception:'+errorThrown );
    }
});
 e.preventDefault();
});
</script>

Now, here is the golang snippet I am trying to get it to interact with. It doesn't seem to be connecting whatsoever to my server since the handlefunc never registers the troubleshooting fmt println.

handlefunc snippet:

func test(w http.ResponseWriter, r *http.Request) {
    fmt.Println("code got here")
    s := `Here is some text from test`
    fmt.Fprintln(w, s)
}

and here is the main() snippet:

func main() {
    http.HandleFunc("/editnote", test)
    http.ListenAndServe(":8080", nil)
}

Any insight here would be highly valued. Thank you so much for reviewing this question.

edit: I forgot to mention that the alert on the script successfully fires, so the on click script is working, just not the ajax.

edit2: via developer console:

Uncaught TypeError: $.ajax is not a function
    at HTMLDivElement.<anonymous> ((index):153)
    at HTMLDivElement.dispatch (jquery-3.2.1.slim.min.js:3)
    at HTMLDivElement.q.handle (jquery-3.2.1.slim.min.js:3)

Update: it appears that the issue here after i did some digging about the console was that i was using a slim version of jquery 3.2.1. After switching to a minified non-slim version, i am getting server responses to the query! I still have loads of work to do on this app, but this was a very valued solution! Thanks very much to everyone who helped me diagnose this problem!

Upvotes: 0

Views: 1431

Answers (1)

jeevatkm
jeevatkm

Reputation: 4791

It seems jQuery slim build, doesn't support ajax function. So include jquery-3.2.1.min.js try, it will work.

SO post: Read about normal vs slim build.

Can you try this jquery ajax call?

$.ajax({
  type: 'GET', // default is GET, so you can exclude if you want
  url : '/editnote', // don't hard the host address
  dataType: 'html',
  success: function(data) {
     console.log(data);
  },
  error: function(e){
     console.log(e);
  }
});

Upvotes: 1

Related Questions