Community Auth : jQuery auto-populate drop down menu HTTP Error: 200 - El Forum - 05-06-2013
[eluser]Prashanth[/eluser]
Hello everybody,
Am trying to clone the auto-populate example available in the Community Auth authentication system.
Based on selecting an option in one of the drop-down menu, the contents of the next drop-down menu is to be loaded.
Table : places
Code: place_id | place_type | parent_id | name
1 | 3 | 0 | Bangalore Urban
2 | 3 | 0 | Bangalore Rural
3 | 3 | 0 | Mysore
4 | 3 | 0 | Tumkur
5 | 2 | 1 | KR Puram
6 | 2 | 2 | Nelamangala
place_id is the primary key, auto increment
View:
views/administration/create_user/create_village.php
Code: <?php echo form_open( '', array( 'class' => 'std-form', 'style' => 'margin-top:24px;' ) ); ?>
<div class="form-column-left">
<fieldset>
<legend>Village Information:</legend>
<div class="form-row">
<?php
// DISTRICT NAME LABEL AND INPUT ***********************************
echo form_label('District Name','place_d',array('class'=>'form_label'));
echo input_requirement('*');
// Default option
$dist_types[''] = '-- Select --';
// Options from query
//print_r($place);
foreach( $dist as $row )
{
$dist_types[$row->place_id] = $row->name;
}
echo form_dropdown( 'place_d', $dist_types, set_value('place_d'), 'id="place_d" class="form_select"' );
?>
</div>
<div class="form-row">
<?php
// TALUK LABEL AND INPUT ***********************************
echo form_label('Taluk Name','place_p',array('class'=>'form_label'));
echo input_requirement('*');
// If POST, there may be taluks
if( isset( $taluks ) )
{
// Default option
$dist_taluks[] = '-- Select --';
// Options from query
foreach( $taluks as $row )
{
$dist_taluks[$row['place_id']] = $row['name'];
}
}
else
{
// Default option if not POST request
$dist_taluks[] = '-- Select Taluk --';
}
echo form_dropdown( 'place_p', $dist_taluks, set_value('place_p'), 'id="place_p" class="form_select"' );
?>
</div>
<div class="form-row">
<?php
// Village Name LABEL AND INPUT ***********************************
echo form_label('Village Name','place_name',array('class'=>'form_label'));
echo input_requirement('*');
$input_data = array(
'name' => 'place_name',
'id' => 'place_name',
'class' => 'form_input',
'value' => set_value('place_name'),
'maxlength' => '50',
);
echo form_input( $input_data );
?>
</div>
<input type="hidden" name="place_t" value="1" />
</fieldset>
<div class="form-row">
<div id="submit_box">
<?php
// SUBMIT BUTTON **************************************************************
$input_data = array(
'name' => 'form_submit',
'id' => 'submit_button',
'value' => 'Create Village'
);
echo form_submit($input_data);
?>
</div>
</div>
</div>
</form>
JS File
auto-populate-place.js
Code: /*
/*
* Community Auth - auto-populate.js
* @ requires jQuery
*
* Copyright (c) 2011 - 2013, Robert B Gottier. (http://brianswebdesign.com/)
*
* Licensed under the BSD licence:
* http://http://www.opensource.org/licenses/BSD-3-Clause
*/
$(document).ready(function(){
// Whenever one of the form dropdowns is changed
$('#place_d').change(function(){
// When type is changed, reset make
if( $(this).attr('id') == 'place_d' ){
$('#place_p option').attr('selected', false);
}
// Get the CI CSRF token name
ci_csrf_token_name = $('#ci_csrf_token_name').val();
// Set post vars
var post_vars = {
'place_d': $('#place_d option:selected').val(),
'token': $('input[name="token"]').val()
};
post_vars[ci_csrf_token_name] = $('input[name="' + ci_csrf_token_name + '"]').val();
// POST
$.ajax({
type: 'post',
cache: false,
url: $('#ajax_url').val(),
data: post_vars,
dataType: 'json',
success: function(response, textStatus, jqXHR){
if(response.status == 'success'){
// Update the dropdowns and tokens
$('#place_p').html(response.place_p);
$('input[name="token"]').val(response.token);
$('input[name="' + ci_csrf_token_name + '"]').val( response.ci_csrf_token );
}else{
alert(response.message);
}
},
error: function(jqXHR, textStatus, errorThrown){
alert('Error: Server Connectivity Error.\nHTTP Error: ' + jqXHR.status + ' ' + errorThrown);
}
});
});
});
when I change the drop-down selection of place_d in the views, jQuery gives an error
Quote:Error: Server Connectivity Error.
HTTP Error: 200 SyntaxError: JSON.parse: unexpected character
Have spent hours on this finding no solution. Please help.
Thanks in advance.
Community Auth : jQuery auto-populate drop down menu HTTP Error: 200 - El Forum - 05-06-2013
[eluser]Prashanth[/eluser]
Controller: controllers/administration.php
Code: public function create_place( $type = '' )
{
// Make sure an admin or manager is logged in. (showing how to log in by group)
if( $this->require_group('employees') )
{
// Load resources
$this->load->library('csrf');
$view_data['roles'] = $this->authentication->roles;
if( ! empty( $type ) )
{
// Get level associated with type (role)
$view_data['level'] = $this->authentication->levels['manager'];
$view_data['type'] = $type;
// Confirm the type of user is permitted
if( $this->auth_level < $view_data['level'] )
{
die();
}
// Check if a valid form submission has been made
if( $this->csrf->token_match )
{
// Create the user
$this->load->model('place_model');
$this->place_model->create_place( $type );
}
if($type != 'district')
{
$this->load->model('place_model');
$view_data['dist'] = $this->place_model->get_places(3);
if( $this->csrf->token_match )
{
if( $this->input->post('place_d') )
{
$view_data['taluks'] = $this->place_model->get_taluks_in_dist();
}
}
}
// Load the appropriate place creation form
$view_data['place_creation_form'] = $this->load->view( 'administration/create_place/create_' . $type, ( isset( $view_data ) ) ? $view_data : '', TRUE );
}
$data = array(
'javascripts' => array(
'js/auto_populate/auto-populate-place.js'
),
'content' => $this->load->view( 'administration/create_place', ( isset( $view_data ) ) ? $view_data : '', TRUE ),
);
$this->load->view( $this->template, $data );
}
}
Model: models/place_model.php
Code: public function get_places($var)
{
$query = $this->db->select('place_id,name')
->where('place_type',$var)
->order_by('name')
->get( config_item('place_table') );
if( $query->num_rows() > 0 )
{
return $query->result();
}
return FALSE;
}
public function get_taluks_in_dist()
{
$dist = $this->input->post('place_d');
$this->db->select('place_id,name');
$this->db->where('parent_id',$dist );
$query = $this->db->get( config_item('place_table') );
if( $query->num_rows() > 0 )
{
return $query->result_array();
}
return FALSE;
}
Another View: views/administration/create_place.php
Code: echo '<h1>' . ( isset( $type ) ? ucfirst( $type ) . ' Creation' : 'Place Creation' ) . '</h1>';
if( isset( $validation_passed, $place_created ) )
{
echo '
<div class="feedback confirmation">
<p class="feedback_header">
The new ' . $type . ' has been successfully created.
</p>
</div>
';
}
else if( isset( $validation_errors ) )
{
echo '
<div class="feedback error_message">
<p class="feedback_header">
' . ucfirst( $type ) . ' Creation Contained The Following Errors:
</p>
<ul>
' . $validation_errors . '
</ul>
<p>
' . strtoupper( $type ) . ' NOT CREATED
</p>
</div>
';
}
if( isset( $level, $type ) )
{
echo $place_creation_form;
}
else
{
echo '
<p>Please choose a place type to create:</p>
<ul class="std-list">
';
/*foreach( $roles as $k => $v )
{
if( $k < $auth_level )
{ */
echo '<li>' . secure_anchor( 'administration/create_place/district', 'district' ) . '</li>';
echo '<li>' . secure_anchor( 'administration/create_place/taluk', 'taluk' ) . '</li>';
echo '<li>' . secure_anchor( 'administration/create_place/village', 'village' ) . '</li>';
/*}
}*/
echo '</ul>';
}
Community Auth : jQuery auto-populate drop down menu HTTP Error: 200 - El Forum - 05-07-2013
[eluser]TheFuzzy0ne[/eluser]
Try using Firebug with Firefox. It will allow you to see what's been sent from the server, so you can find your problem. I suspect your PHP might be showing an error, which should be present in the returned data from the server.
|