My cascadeFrom is not working for my DropDownList in my Tabs. The DropDownList are being loaded based on the SQL but when the parent text field is changed, the child text field doesn't change to reflect the parent text field. I have included my Html code:
<div class="col-md-2 mb-3">
<label for="<?php echo $locnum . '_'; ?>WWCBR">Brand:</label>
<input type="text" class="form-control" id="<?php echo $locnum . '_'; ?>WWCBR"
name="<?php echo $locnum . '_'; ?>WWCBR" placeholder=""
value="<?php echo($loc['WWCBR']); ?>" <?php echo $status3; ?>>
<div class="row">
<br/>
<div class="col-md-6 mb-3">
</div>
</div>
<div class="invalid-feedback">
<?php
if (isset($errors[$locnum . '_WWCBR'])) {
echo "<span class='error_class'>" . $errors[$locnum . '_WWCBR'] . "</span>";
}
?>
</div>
</div>
<div class="col-md-1 mb-3">
<label for="<?php echo $locnum . '_'; ?>WWCMAT">Material Type:</label>
<input type="text" class="form-control" id="<?php echo $locnum . '_'; ?>WWCMAT"
name="<?php echo $locnum . '_'; ?>WWCMAT" placeholder=""
value="<?php echo($loc['WWCMAT']); ?>" <?php echo $status3; ?>>
<div class="invalid-feedback">
<?php
if (isset($errors[$locnum . '_WWCMAT'])) {
echo "<span class='error_class'>" . $errors[$locnum . '_WWCMAT'] . "</span>";
}
?>
</div>
</div>
<div class="col-md-1 mb-3">
<label for="<?php echo $locnum . '_'; ?>WWCDIA">Diameter:</label>
<input type="number" class="form-control" id="<?php echo $locnum . '_'; ?>WWCDIA"
name="<?php echo $locnum . '_'; ?>WWCDIA" placeholder=""
value="<?php echo($loc['WWCDIA']); ?>" <?php echo $status3; ?>>
<div class="invalid-feedback">
<?php
if (isset($errors[$locnum . '_WWCDIA'])) {
echo "<span class='error_class'>" . $errors[$locnum . '_WWCDIA'] . "</span>";
}
?>
</div>
</div>
</div>
<?php
$locnum = 0;
foreach($Locations as $loc){
?>
var WWCBR = [
<?php
$var1 = "W";
$recordsql = 'SELECT Distinct WWCBR, WWCSUP FROM S_ICSWWC WHERE WCO = ? AND WWCWTP = ? ORDER BY WWCBR';
$stmt = db2_prepare($conn, $recordsql);
$res2 = db2_execute($stmt, array($companyI, $var1));
while ($row = db2_fetch_assoc($stmt)) {
echo "{text: '" . $row['WWCBR'] . "-" . $row['WWCSUP'] . "', WWCBR: '" . $row['WWCBR'] . "', WWCSUP: '" . $row['WWCSUP'] . "'},";
}
?>
];
// create DropDownList from input HTML element
$("#<?php echo $locnum . '_';?>WWCBR").kendoDropDownList({
dataTextField: "text",
dataValueField: "WWCBR",
dataSource: WWCBR,
index: 0,
});
var WWCBR = $("#<?php echo $locnum . '_';?>WWCBR").data("kendoDropDownList");
var WWCMAT = [
<?php
$var1 = "W";
$recordsql = 'SELECT Distinct WWCBR, WWCMAT FROM S_ICSWWC WHERE WCO = ? AND WWCWTP = ?';
$stmt = db2_prepare($conn, $recordsql);
$res2 = db2_execute($stmt, array($companyI, $var1));
while ($row = db2_fetch_assoc($stmt)) {
echo "{text: '" . $row['WWCMAT'] . "', WWCMAT: '" . $row['WWCMAT'] . "', WWCBR: '" . $row['WWCBR'] . "'},";
}
?>
];
// create DropDownList from input HTML element
$("#<?php echo $locnum . '_';?>WWCMAT").kendoDropDownList({
dataTextField: "WWCMAT",
dataValueField: "WWCMAT",
cascadeFrom: "WWCBR",
dataSource: WWCMAT,
index: 0,
});
var WWCMAT = $("#<?php echo $locnum . '_';?>WWCMAT").data("kendoDropDownList");
var WWCDIA = [
<?php
$var1 = "W";
$recordsql = 'SELECT WWCMAT, WWCDIA FROM S_ICSWWC WHERE WCO = ? AND WWCWTP = ?';
$stmt = db2_prepare($conn, $recordsql);
$res2 = db2_execute($stmt, array($companyI, $var1));
while ($row = db2_fetch_assoc($stmt)) {
echo "{text: '" . $row['WWCDIA'] . "', WWCDIA: '" . $row['WWCDIA'] . "', WWCMAT: '" . $row['WWCMAT'] . "'},";
}
?>
];
// create DropDownList from input HTML element
$("#<?php echo $locnum . '_';?>WWCDIA").kendoDropDownList({
dataTextField: "WWCDIA",
dataValueField: "WWCDIA",
cascadeFrom: "WWCMAT",
dataSource: WWCDIA,
index: 0,
});
var WWCDIA = $("#<?php echo $locnum . '_';?>WWCDIA").data("kendoDropDownList");
<?php
$locnum++;
}
?>
I don't think I have the Kendo Dropdownlist set up correctly for:
$("#WWCMAT").kendoDropDownList({ dataTextField: "WWCMAT", dataValueField: "WWCMAT", cascadeFrom: "WWCBR", dataSource: WWCMAT, index: 0,
Please let me know what I need to change to make this work.