0

I am making submitting an ajax form with response coming back in Json. Everything works fine except for an instance where I needed to send response to you user containing some html, precisely a url link for the user to view specific data. So, the challenge is the callback response from the server fails thereby returning error. But if i remove the html link, everything works fine. Also, if i check the network information from the browser inspect element, the desired response message containing the link as expected is received but jquery seems to fail displaying it.

if it is important or necessary to state, it is a codeigniter based App.

Below is the html enclosed in the callback response :

<a href="www.myurl.com/index.php/student/parent-profile/b38d128b180b04afc">Click here to View Profile</a>

I need help on how to pass the url above alongside any other text coming back from the server. I need to know how to either by encoding and decoding the data from or any other alternate method of getting this done.

Below are some line from my js

    jQuery.ajax({
            url:        site_url+'/add-student-process',
            type:       'POST',
            data:       form_data,
            dataType:   'json',
            contentType: "application/x-www-form-urlencoded;charset=utf-8",
            cache:      false
            })
    .done(function(resp){               
        if(resp.type === "error"){
            jQuery("#ajax_form_resp").html(resp.value);                                 
        }
        else if(resp.type === "okay"){
            jQuery("#ajax_form_resp").html(resp.value);                                         
        }
    })
    .fail(function(){
        jQuery("#ajax_form_resp").html('Error encountered while processing request. Pls try again shortly.');
    });

Would be really glad getting help with this.

John
  • 153
  • 1
  • 3
  • 13
  • Create a response array `$response = array(); $response['url']=xxx; $response['text']=yyy; echo json_encode($response);` and you can parse it in json and create a tag – SPViradiya Oct 27 '16 at 12:31
  • 1
    @SPViradiya Thanks.. Found a solution to it – John Oct 27 '16 at 13:47

2 Answers2

0

Passing through tags you receive from the server in html to the dom is in general a bad idea. Like a comment mentioned putting your raw data (url and text) in an array and sending that to the client makes you more flexible. You still have to create the link tag in javascript but you can also whitelist the url and text much easier.

Back to the problem: Your jquery ajax configuration expects the response to be in json (dataType). This means the response has to be a string in json format. If you send raw html back it won't fair well. A dirty hack would be to feed the raw html to json_encode and send that to the client. Then it would at least be correctly escaped. I think escaping is your problem.

echo json_encode($raw_html);
user2032300
  • 61
  • 4
0

Found a link that helped resolved it.

var text = '&lt;p&gt;name&lt;/p&gt;&lt;p&gt;&lt;span style="font-size:xx-small;"&gt;ajde&lt;/span&gt;&lt;/p&gt;&lt;p&gt;&lt;em&gt;da&lt;/em&gt;&lt;/p&gt;';
var decoded = $('<div/>').html(text).text();
alert(decoded);

Javascript decoding html entities

Community
  • 1
  • 1
John
  • 153
  • 1
  • 3
  • 13