0

I'm building a form based process in a 3rd party web based platform, initial form is complete and has some fields that are hidden until options via a drop down are selected. The code for this is below and it works.

 //Hide fields until number of banners is selected
$("#CWE_Pull1").hide();
$("#CWE_Pullup2").hide();
$("#CWE_Pullup3").hide();
$("#CWE_Pullup4").hide();


$("#CWE_PullUp").setOnchange( function(newVal, oldVal) {
if (newVal == "1") {
$("#CWE_Pull1").hide();
$("#CWE_Pullup2").hide();
$("#CWE_Pullup3").hide();
$("#CWE_Pullup4").hide();
}
else if (newVal == "2") {
$("#CWE_Pull1").show();
$("#CWE_Pullup2").hide();
$("#CWE_Pullup3").hide();
$("#CWE_Pullup4").hide();
}
else if (newVal == "3") {
$("#CWE_Pull1").show();
$("#CWE_Pullup2").show();
$("#CWE_Pullup3").hide();
$("#CWE_Pullup4").hide();
}
else if (newVal == "4") {
$("#CWE_Pull1").show();
$("#CWE_Pullup2").show();
$("#CWE_Pullup3").show();
$("#CWE_Pullup4").hide();
} else if (newVal == "5") {
$("#CWE_Pull1").show();
$("#CWE_Pullup2").show();
$("#CWE_Pullup3").show();
$("#CWE_Pullup4").show();
}
});

In step 2 the form goes to a different user and I mark the fields to be read only. I can select if the user has Parent, Edit, View or disabled access to fields via the form builder GUI, this is how read only is chosen.

In the debugger for the read only copy I can see the variable is displaying a value as per the picture below so if I try the below If\Else if statement nothing happens.

$("#CWE_Pull1").hide();
$("#CWE_Pullup2").hide();
$("#CWE_Pullup3").hide();
$("#CWE_Pullup4").hide();


if ("#CWE_PullUp" == "2") {
    $("#CWE_Pull1").show();
    $("#CWE_Pullup2").hide();
    $("#CWE_Pullup3").hide();
    $("#CWE_Pullup4").hide();
    }
  else if ("#CWE_PullUp" == "3") {
    $("#CWE_Pull1").show();
    $("#CWE_Pullup2").show();
    $("#CWE_Pullup3").hide();
    $("#CWE_Pullup4").hide();
    }
else if ("#CWE_PullUp" =="4") {
    $("#CWE_Pull1").show();
    $("#CWE_Pullup2").show();
    $("#CWE_Pullup3").show();
    $("#CWE_Pullup4").hide();
    }
else if ("#CWE_PullUp" == "5") {
    $("#CWE_Pull1").show();
    $("#CWE_Pullup2").show();
    $("#CWE_Pullup3").show();
    $("#CWE_Pullup4").show();
    }
;

Variable Image

If I dont have the 4 fields hidden before the if \ else if statement then the fields are all unhidden. I also tried outputting the value of 'CWE_PullUp' to a 2nd variable that wasn't a drop down and using that as the basis for the if \ else if statement but it also did not work.

Gunna
  • 13
  • 4

3 Answers3

2

"#CWE_PullUp" == "2" is always false.

If you intend to read its value, you should use $("#CWE_PullUp").val(). So the comparison should be $("#CWE_PullUp").val() == "2".

Nisarg Shah
  • 14,151
  • 6
  • 34
  • 55
  • So the line should read: `if $("#CWE_Pullup").val() == "2" {` or `if ($("#CWE_Pullup").val() == "2") {` – Gunna Oct 18 '17 at 06:22
  • The second one. You need to wrap the `if` conditions with `(` and `)` brackets. – Nisarg Shah Oct 18 '17 at 06:26
  • Ok that did not unhide the field. – Gunna Oct 18 '17 at 06:54
  • Can you check the browser console (F12), and post a screenshot or error messages here? Perhaps even look the line numbers in particular files that are causing errors. – Nisarg Shah Oct 18 '17 at 06:57
  • @Gunna Can you try adding some `console.log("Value 2")` like statements in the code, and see if those are getting executed at all. Alternatively, just run the statement `$("#CWE_Pullup").val()` in console and see if it returns expected result. – Nisarg Shah Oct 18 '17 at 06:59
1

So this was the solution:

if ($("#CWE_PullUp").getValue() === "2") {
    $("#CWE_Pull1").show();
}
else if ($("#CWE_PullUp").getValue() === "3") {
    $("#CWE_Pull1").show();
    $("#CWE_Pullup2").show();
}
else if ($("#CWE_PullUp").getValue() === "4") {
    $("#CWE_Pull1").show();
    $("#CWE_Pullup2").show();
    $("#CWE_Pullup3").show();
}
else if ($("#CWE_PullUp").getValue() === "5") {
    $("#CWE_Pull1").show();
    $("#CWE_Pullup2").show();
    $("#CWE_Pullup3").show();
    $("#CWE_Pullup4").show();
}
Leopold Joy
  • 4,524
  • 4
  • 28
  • 37
Gunna
  • 13
  • 4
0

I think you made a mistake in your conditions...

"#CWE_PullUp" == "2"

This tests if the STRING #CWE_PullUp is equal to 2!

I think that you'd want to use the variable value instead:

CWE_PullUp == "2"
Salketer
  • 14,263
  • 2
  • 30
  • 58
  • Removing the " " and the # from the statement results in the form not opening which usually indicates an issue with the JavaScript – Gunna Oct 18 '17 at 06:17
  • From the screenshot you provided, it looked as if there was those variables available in the scope... If not that means you'd have to work around it, but unfortunately I do not have enough information to help you more. I hope that pointing out this error will still be helpful to you. – Salketer Oct 19 '17 at 09:27