ajax and codeigniter Post dataString and receive array

Question

I have this view where I collect a key named MYVAR in a form contactForm

<form class="form-wrapper cf" id="contactForm">
   <input name="MYVAR" type="text" placeholder="DO_IT..." required>
   <button type="submit" id="btn_submit" >  DO IT </button>
</form>

then in this view I have a script to send via ajax this key to controller as dataString

<script type="text/javascript">
jQuery(function() {
    jQuery(".btn_submit").click(function() {
    var MYVAR       = jQuery("input#MYVAR").val();
    var dataString  = 'MYVAR='+ MYVAR;
    alert(dataString);
    jQuery.ajax({
        type: "POST",
        url: "<?php echo base_url()?>index.php/do_it/method/",
        data: dataString,
        success: function() {
            jQuery('#successMessage').html("<b><p style='color:#5b5b5b; float:left; margin-top:3px; padding-top:50px;'>success.</p></b><br/><br/>")
            .hide()
            .fadeIn(1500, function() {
            jQuery('#successMessage');
            });
        }
    });
    return false;
    });
});
</script>

In the controller do_it inside method i would read var MYVAR

function method()
{   
  //posted var
  $key = $this->input->post('MYVAR');
  $this->load->model('mine_model');
  //get data according key variable 
  $data['result'] = $this->mine_model->get( array('data' => $MYVAR));
  //encode it? 
  echo json_encode($data); 
  //$this->load->view('view',$data);
}

But Is not doing anything...

What am I missing?

Also I do not have any idea How to receive $data ['result'] in view with jQuery and then print it in view?

Éderson T. Szlachta · Accepted Answer · 2013-03-29 04:42:12Z

1

I have some code that do it like you want:

My JS:

$(function() {
  $('#contactForm').submit(function() {
    var dataString = $(this).serialize();
    $.ajax({
      type : 'post',
      url  : '<?php echo base_url()?>index.php/do_it/method/',
      data : dataString,
      dataType : 'json',
      success : function(res) {
        console.log(res); // to see the object
        // your code here
      }
    });
    return false;
  });
});

My PHP (CodeIgniter)

function method() { 
  $key = $this->input->post('MYVAR');
  $this->load->model('mine_model');
  $data['result'] = $this->mine_model->get( array('data' => $MYVAR));

  // set text compatible IE7, IE8
  header('Content-type: text/plain'); 
  // set json non IE
  header('Content-type: application/json'); 

  echo json_encode($data);
}

answered Mar 29, 2013 at 4:42

Éderson T. Szlachta

5186 silver badges6 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Éderson T. Szlachta Over a year ago

OH,, I forgot something: you don't need to verify the browser to output header on PHP.. if you set just "text/plain" works fine for every browser.. I've tested.. ;)

edgarmtze Over a year ago

How can I print result if is an array?

jQuery('#successMessage').html("<b><p style='color:#5b5b5b; float:left; margin-top:3px; padding-top:50px;'>success.</p></b><br/><br/>")

Éderson T. Szlachta Over a year ago

do you want an array back from PHP ?? ou just HTML ? if is an array you care about an object echo json_encode(array('message' => 'Success')); and than in you JS: $('#successMessage').html(res.message);

edgarmtze Over a year ago

yes, the result I get from model is an array, this I want to print it, If I would not be using ajas I will only write:

foreach ($result  as $val):   ?> <h2><? echo "ID: " . $val['1st']; ?> </h2> <h3><? echo "IDW: " . $val['2nd'] ?></h3> <?endforeach ; ?>

Éderson T. Szlachta Over a year ago

I use if ($this->input->is_ajax_request() { by CodeIgniter to verify ajax or not, by this condition I print an array (to ajax) or a HTML (normal request)

mrsrinivas · Accepted Answer · 2013-03-29 04:38:17Z

1

Once try this code

jQuery(function() {
    jQuery(".btn_submit").click(function() {
        alert(jQuery("input#MYVAR").val());
        jQuery.ajax({
            type: "POST",
            url: "<?php echo base_url()?>index.php/do_it/method/",
            data: {MYVAR:jQuery("input#MYVAR").val()},
            success: function() {
                jQuery('#successMessage').html("<b><p style='color:#5b5b5b; float:left; margin-top:3px; padding-top:50px;'>success.</p></b><br/><br/>")
                .hide()
                .fadeIn(1500, function() {
                jQuery('#successMessage');
                });
            }
        });
        return false;
    });
});

In controller just send the data like this*(You have already done)*

echo json_encode(array('success'=> 'true', 'data' => array(1,2,3)))

But in your in view success() needs to be changed to success(response)

You can use the json result like this

success: function(response) {
    if(response.status){
        jQuery('#successMessage').html("<b><p style='color:#5b5b5b; float:left; margin-top:3px; padding-top:50px;'>success.</p></b><br/><br/>")
        .hide()
        .fadeIn(1500, function() {
        jQuery('#successMessage');
        });

        //response.data[0] gives 1
        //response.data[1] gives 2
        //response.data[2] gives 3
    }
}

edited Mar 29, 2013 at 4:38

answered Mar 29, 2013 at 4:31

mrsrinivas

35.7k13 gold badges133 silver badges132 bronze badges

1 Comment

edgarmtze Over a year ago

I am having trouble, could you please post all code?, Maybe I am still missing something as after writing "1" and then clicking button the following appears in url index.php/do_it?MYVAR=1

Collectives™ on Stack Overflow

ajax and codeigniter Post dataString and receive array

2 Answers 2

5 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related