Question

I have a php webform that uses an external js file

that external files runs events such as: onload, onchange, and onSubmit

In my php application, I have gathered data from db my using this:

<?php
$reqFlds  = array();
$results = mysql_query("select id, display_name from field where account_id = $acct_id2 and required_flag = 1");
    while($RequireResult = mysql_fetch_assoc($results))
        {
            $reqFlds[] = $RequireResult;
        }
    foreach($reqFlds as &$reqFld)
        {
            $reqFld = "'".$reqFld["id"] . "||" . $reqFld["display_name"]."'";
        }
?>

I then use json to gather the data and dump it into an variable
js script inside php application

<script language="javascript">
    var holdReqFlds = <?php echo json_encode($reqFlds); ?>;
</script>

The var/array result displays like this
View from page source

<script language="javascript">
    var holdReqFlds = ["'15||Project Requested By'","'18||Project Title'","'20||Banner Details'","'202||Flyer Details'","'2134||If Gl Code Not above'","'5862||Quantity'"];
</script>

Admittedly, I am just learning json, so here is what I can’t figure out: how do I feed this value to the function in my external js file?

Below is the javascript function for reference – this will run when the submit button is clicked within php app. In short – i’m passing all the fields flagged as required to the holdReqFlds variable. That var will then be passed to the chkReq() function below and determine if a field is within a fieldset that is currently being displayed

i need to pass the holdReqFlds var to the chkReq() function that is in the external javascript file: How?

 * ###################################
 *  PAGE ONSUBMIT FUNCTION
 * ###################################

function job_onsubmit(action)
{
function isVisible(field) {
    if (field.offsetWidth === 0 || field.offsetHeight === 0) return false;
}

function isBlank(field) {
    if ((field.type == "text" || field.type == "textarea") && field.value.length <= 0) return true;
    if (!(field.checked || field.selected || field.selectedIndex > -1)) return true;
    return false;
}

function chkReq(fieldList) {
    var field = null;
    var blankFields = [];
    for (var i = 0; i < fieldList.length; i++) {
        listItem = fieldList[i].split;
        fieldId = field[0];
        label = field[1];
        field = document.getElementById(fieldList[i].split("||")[0]);
        if (isVisible(field) && isBlank(field)) {
            blankFields[blankFields.length] = fieldList[i].split[1];
        }
    }
    if (blankFields.lentgh > 0) {
        displayError(blankFields);
        return false;
    } else {
        return true;
    }
}

function displayError(blankFields) {
    var msg = "Input required:\n\n";
    for (var i = 0; i < blankFields.length; i++) {
        msg += blankFields[i] + "\n";
    }
}
}

Answer 1

Assuming that holdReqFlds is available in global scope you would just do:

var result = chkReq(holdReqFlds);

One other thing of note is that your JSON looks odd in that you have single quotes inside the double quotes for each value. It seems very strange the way you are concatenating these values together. You are probably better off just building actual objects and JSON encoding them so you don’t have to deal with any string manipulation in javascript to get at the values. Try something like this:

while($RequireResult = mysql_fetch_object($results)) {
    $reqFlds[] = $row;
}

$json = json_encode($reqFlds);

This will give you a nice of array of objects that are way easier to work with in javascript.