Trigging jQuery without a specific event
Hello Folks:
Hoping to get some help with a small problem. The problem is outlined below:
- I've a registration page which shows different groups of fields for different types of registrations. So... a user must first choose the registration type, and then a jQuery function shows the appropriate fields.
- The user enters data and POSTS it to the same .php page.
- php validates data (I'm not using jQuery to do the validation because I don't want to send passwords through jQuery).
- If php populates an $errors array, error messages are returned to display on the page.
- My goal is to also return original post data and display that data in the appropriate fields.
- In order to do this I must feed jQuery the user's registration choice and show appropriate fields, populated with their posted data.
- I've successfully captured the user's registration choice and assigned $_POST data to a javascript variable. My problem is getting the appropriate fields to display.
- I think I'm going wrong on how I trigger fields to display. Following is my script - pay special attention to lines 2 and then further down the script line 3.
- <script type="text/javascript">
// Whole-script strict mode syntax
"use strict";
var var_POST = new Array();
var var_POST;
var_POST = <? echo json_encode($_POST)?>;
var user_choice = <? echo json_encode($errors['regType'])?>;
$(document).ready(function() {
- if (user_choice)
{
console.log("There are errors: " + user_choice);
showControls(user_choice);
}
$.getJSON('select_orgtype.php', function(data) {
var select = $('#orgType');
$('#orgType').append($('<option>').attr('value', ""));
$.each(data, function(i, value) {
$('#orgType').append($('<option>').text(value. ClientType ).attr('value', value["0"]));
});
});
$('#reg_Org').hide();
$('#reg_Ind').hide();
//================================== Show appropriate <divs> by user choice ===============================
$('#regType').change(function() {
user_choice = $(this).attr('value');
showControls(user_choice);
});
}); // END Document Ready Function
//============================= IN HOUSE FUNCTIONS ===================
- // the following function is triggered when the user selects a registration type AND when errors come back from php. Although the console.log is triggering when errors come back, the fields are NOT displaying. I believe it is because I'm triggering the function with a simple if() statement at the beginning of my document ready function - but don't know how else to trigger it.
function showControls(switch_choice){
console.log("entered showControls()" + switch_choice);
switch(switch_choice)
{
case "1":
$('#reg_Org').slideDown();
$('#reg_Ind').slideDown();
$('#regError').hide();
$('#reg_name').show();
$('#reg_h4').html('Account Administrator Information - All Fields are Required');
break;
case "2":
$('#reg_Org').slideUp();
$('#reg_Ind').slideDown();
$('#regError').hide();
$('#reg_name').hide();
$('#reg_h4').html("User Info (the email address you enter will be validated against your organization's user list).<br />All Fields are Required");
break;
case "3":
$('#reg_Org').slideUp();
$('#reg_Ind').slideDown();
$('#regError').hide();
$('#reg_name').show();
$('#reg_h4').html('Profile Information - All Fields are Required');
break;
case "0":
$('#reg_Org').slideUp();
$('#reg_Ind').slideUp();
$('#regError').show();
$('#regError').html('Please select a registration option before preceding. Thank you.');
break;
}
}
</script>
Sorry for the large block of script, but sometimes context means everything. Following is a comment from the script and where I think things are going wrong:
// the following function is triggered when the user selects a registration type AND when errors come back from php. Although the console.log is triggering when errors come back, the fields are NOT displaying. I believe it is because I'm triggering the function with a simple if() statement at the beginning of my document ready function - but don't know how else to trigger it.
Any assistance with this problem would be greatly appreciated.
Thanks much:
Pavilion