renvrant / conditionize.js Goto Github PK

Any update on multiple inputs with same name e.g radio and also name with [ ]

Demonstrated here: codepen.io/ismailm___/pen/QzEjgj?editors=1010 (i.e. using the JS in the current master branch).

The issue is that checkboxes can hold multiple values - and as such $(input_name:checked).val() will always be the first checked value...

So, need to decide on what is the right behaviour:
- Should the conditional be true as long as the value is included in the checked boxes.
- Or should the expected value be the only checked box?

It should be a relatively easy fix once the above is decided...

Hello, is there a way to handle multiple values like

data-cond-value="color1;color2;color3"

?
If use a select field and want to execute a condition with any of those values.
So if data-cond-value is "color1" OR "color2" OR "color3" the conditionize function is executed.

I tried

var arrayData = $(this).data('cond-value');
var arr = arrayData.split(';');
for (i = 0; i < arr.length; i++) {
// console.log(arr[i]);
var listenFor = (arr[i]);
}

but then only the last value of the array is considered.

In case you want a form field to be shown were it shall be depended on two filed.
Like show C only when A - Yes and B - Yes has been selected.

Multi field dependent Show HIde.txt
In that case use the Attached Demo. Save it as an HTML file.

See here:
https://learn.jquery.com/using-jquery-core/faq/how-do-i-select-an-element-by-an-id-that-has-characters-used-in-css-notation/

Worked :-)

There seems to be an issue depending on the value of a field.

This doesn't work

<input type="radio" name="application_type" value="employer" />
<div class="form-group conditional" data-condition="application_type == 'employer'">

This does work

<input type="radio" name="application_type" value="emploer" />
<div class="form-group conditional" data-condition="application_type == 'emploer'">

Removing the 'y' fixes the problem.

VM6302:1 Uncaught SyntaxError: Unexpected string
    at HTMLDivElement.<anonymous> (create:1102)
    at Function.each (jquery.min.js:2)
    at r.fn.init.each (jquery.min.js:2)
    at r.fn.init.$.fn.conditionize (create:1061)
    at create:1108

how can i add this functionality to select options and text input fields? rather than just input radio buttons?

Hi there,

This iteration on hide is causing child checkboxes to be unchecked when the section is hidden.

$section.find('select, input').each(function(){ if ( ($(this).attr('type')=='radio') || ($(this).attr('type')=='checkbox') ) { $(this).prop('checked', false).trigger('change'); } else{ $(this).val('').trigger('change'); } });

For my purpose, this is unwanted behaviour as the settings should "stay" intact by their default value state (checked or unchecked). For now I removed this part in my copy of the library, but it would be nice to have more control over what to uncheck in the underlaying section and what not.

Using eval() may be not safe. It would be better to avoid it or make safer.

I used in this way>>

Hi,
I'm making a landing page with multiple form but same fields. ¿There is a way to get the condition by some data- instead of name="" ? because the requirement is i have to use the same name for the fields.

Here is the example of my problem:
http://codepen.io/anon/pen/gPVvGY

Thanks

data-condition="#a1 < 5 && #a2 > 25 only the 2nd condition works.

data-condition="#a1 == love && #a1 == magic none of them work.

I even tried just one text condition to show, nothing seems to work.

When i tried typing love it shows error in console : $('#a1').val()==love

Uncaught ReferenceError: love is not defined

Not sure if this is the right place but are there any plans for adding this to something like yarn or NPM in the future, if not is this something which could be done?

I would like to add keyup as a trigger.

Hey,

The original conditionize.js works with names with [] but it would be nice to upgrade to conditionize.flexible.js...

The original version cleaned the parameter to take this into account

The new version uses \w in a regex which doesn't match [\w+]

Perhaps changing the regex to (#?[\w\[\]]+) will fix this issue?

See this pen:
https://codepen.io/anon/pen/dQeyow

All I did was replace example1 with example-1 in the id and the data-condition. I work with a CMS where I do not have control over all the ids generated, so all allowed id characters should work in the script.

Error:
Uncaught SyntaxError: Invalid or unexpected token
at HTMLParagraphElement. (pen.js:67)
at Function.each (jquery.min.js:2)
at w.fn.init.each (jquery.min.js:2)
at w.fn.init.$.fn.conditionize (pen.js:26)
at pen.js:72

Hi there again,
I find it useful if some events would be triggered on the element on hiding and on showing. I am dealing with some validation and required fields (inside hidden sections) on the FE and BE side. So I need to toggle the required attribute depending if the section is shown or not.

I do not know how to do a PR, but this is basically what I would want/need:

$.fn.showOrHide = function(is_met, $section) {
        console.log('is_met', is_met);
      if (is_met) {
        $section.slideDown();
        $section.trigger('sectionvisible');
      }
      else {
        $section.slideUp();
        $section.find('select, input').each(function(){
            if ( ($(this).attr('type')==='radio') || ($(this).attr('type')==='checkbox') ) {
                $(this).prop('checked', false).trigger('change');
            }
            else{
                $(this).val('').trigger('change');
            }
        });
        $section.trigger('sectionhidden');
      }
    };

Hi everyone,

I'm getting a little issue with conditionize.flexible.jquery.js

I have a field named email, and other field below with data-condition=email != ''
This works fine but I have a JS function which remove invalid values from email, so if I put an invalid value in email field, the other field is shown but the email field is ''.

I think the condition is not checked again after JS function is executed.

Someone knows how to solve this?

I have a field name="First Name" , it has a space in it but conditionize is throwing an error as it is unexpected, any solution so it works with names with spaces?

Does conditionize.jquery.js work in IE at all? I am having issues with the dropbox not working.

what would be the condition if i want to show the next field when the first field has some value in it e.g show field 2 when field 1 is not empty.

Hey,

what license is this work under?