samedi 20 novembre 2021

Zapier Python editor doesn't output anything even though code works in python

I'm trying to create code that matches True/False messages from checkboxes from a form to the checkbox titles. Whenever the checkboxes are clicked, the titles should be appended to a list that is outputted in the end.

This is my code:

def nische(input_data):
nischen = []
for key in input_data:
    if input_data[key] == True:
        print(key)
        nischen.append(key)
if input_data['Sonstiges'] != "":
    nischen.append(input_data['Sonstiges'])
string = ', '.join(nischen)
string = str(string)
return string

result = nische(input_data) output = print(result)

​I've tried everything, but the Zapier Interpreter shows no output.

this is the zapier output enter image description here ​ ​

​ ​




Changing svg shape color on checkbox click

I would like to change the fill color of an svg shape when a checkbox is clicked. I have this working, however if I wrap the checkbox input in a div tag it no longer works.

#circles {
  fill: #00ffff;
}

#circ-toggle .toggler:checked~#circles .circ1 {
  fill: #000000;
  fill-opacity: 0.3;
}
<div id="circ-toggle" class="toggle">
  <input type="checkbox" id="toggle-1" class="toggler">
  <label for="toggle-1" class="btn-toggle">Change Color</label>
</div>

<div id="circles">
  <svg viewBox="0 0 40 30">
        <g>
            <circle class="circ1" cx="1" cy="1" r="1" />
            <circle class="circ2" cx="3" cy="1" r="1" />
        </g>
    </svg>
</div>



Rendering unchecked checkbox

Well I'm facing a tiny issue with rendering new unchecked checkboxes. Throug an input field I can add tasks as list, each has checkbox & label. Checkbox onChange works fine, but when I add a new task the newly rendered checkbox is checked, which caused obviously by the useState which's been set true after clicking the checkbox, how to reset the state to false and render an unchecked checkbox?

My code:

input type="checkbox" defaultChecked={checked} onChange={handelChange}

const [checked, setChecked] = useState(false);

const handelChange = (e) => {setChecked(!checked)};``




Flutter: After searching in the checkbox list, the checkboxes are broken

There is a listview in my Flutter project and a CheckboxListTile inside it.

I am using a search widget that controls this Listview.

My problem is: When I search for a listview element, the result appears and when I reset the search after I set the checkbox value of that listview element to true, I see that the first element of the list is marked, not the element I marked on the screen.

I am attaching a short video below to explain this problem better.

VIDEO LINK YOUTUBE

And also this is my code:

My Search Widget:

  TextEditingController _controller = TextEditingController();
  List<bool>? _isChecked;
  List<String> _selectedItems = <String>[];
  List<Gruplar>? grup;
  String query = '';
  bool _checkInTheBox = false;

 GrupSearch(
                                        text: query,
                                        controller: _controller,
                                        onChanged: (String query) {
                                          final grup =
                                              allGrup.where((element) {
                                            final titleAd =
                                                element.ad!.toLowerCase();
                                            final searchLower =
                                                query.toLowerCase();

                                            return titleAd
                                                .contains(searchLower);
                                          }).toList();
                                          _setState(() {
                                            this.query = query;
                                            this.grup = grup;
                                            this.query = "";
                                          });
                                        }),

My ListView

ListView.builder(
                                          itemCount: grup!.length,
                                          itemBuilder: (context, index) {
                                            final items = grup![index];
                                            return CheckboxListTile(
                                                value: _isChecked![index],
                                                checkColor:
                                                    it_tool_main_blue,
                                                tileColor: Colors.black,
                                                activeColor: Colors.white,
                                                selectedTileColor:
                                                    Colors.black,
                                                title: Text(
                                                  grup![index].ad!,
                                                  style: TextStyle(
                                                      fontSize: MediaQuery.of(
                                                                  context)
                                                              .size
                                                              .width /
                                                          27,
                                                      color:
                                                          it_tool_main_blue,
                                                      fontWeight:
                                                          FontWeight.bold),
                                                ),
                                                onChanged: (val) {
                                                  _setState(() {
                                                    if (!_selectedItems.contains( grup![index].ad)) {
                                                      _selectedItems.add(
                                                          grup![index]
                                                              .ad
                                                              .toString());
                                                      _isChecked![index] =
                                                          val!;
                                                      print(_selectedItems);
                                                    } else {
                                                      _selectedItems.remove(
                                                          grup![index]
                                                              .ad
                                                              .toString());
                                                      _isChecked![index] =
                                                          val!;
                                                      print(_selectedItems);
                                                    }
                                                  });
                                                });
                                          }),

As a result, I want the checkbox I selected after searching to appear correctly after the search is over.

Thanks for your help.




vendredi 19 novembre 2021

toggle svg circle color with checkbox

I would like a toggle button that changes the color of a svg, a circle in this case. I am able make a checkbox that changes the color of text purely in HTML and CSS, but it is not working with an svg.

Here is the code that works for text.

<label for="element-toggle">click me to toggle color</label>
<input id="element-toggle" type="checkbox" />

<div id="toggled-element">My color will be toggled</div>
label[for=element-toggle] {
  cursor: pointer;
  color: blue;
}

#toggled-element {
  color: green;
}

#element-toggle:checked ~ #toggled-element {
  color: red;
}

Here is my attempt to use the same logic to change the color of an svg circle instead of text (this doesn't work)

<label for="element-toggle">click me to toggle color</label>
<input id="element-toggle" type="checkbox" />

<svg viewBox="0 0 40 30">
  <circle id="toggled-element" cx="1" cy="1.2" r="1" />
</svg>
label[for=element-toggle] {
  cursor: pointer;
  color: blue;
}

#toggled-element {
  fill: green;
}

#element-toggle:checked ~ #toggled-element {
  fill: red;
}



JavaScript checkbox function

Let userDice=[
{'dice': 0, 'checked': false,’id’ : “d1”},
{'dice': 0, 'checked': false, ’id’ : “d2”},
{'dice': 0, 'checked': false, ’id’ : “d3”},
{'dice': 0, 'checked': false, ’id’ : “d4”},
{'dice': 0, 'checked': false, ’id’ : “d5”}
]
// click function 
$("#d1Check"). click(function() {
if (userDice{0].checked)
{
userDice{0].checked = false;
alert("false")
}
else
{
userDice[0].checked = true;}
alert(“true”)
})
})

Can anyone explain to me what the click function does? I know it keeps my checkbox checked even if i shuffle/roll my dice and won’t change the value but I’d like to understand how to read it. I’ve been reading it as when i click my function of the id=d1check, if user dice of the first one I’m on is checked it’s false or else it’s true? But if i checked it wouldn’t it be true and not false? TIA for the help




Jquery Show or hide content block on click on checkbox

I have several checkboxes when clicking on a certain checkbox, I want to show some content (in my case, this is a simple block for an example) when clicking on another checkbox, the previous block should hide and display a new block, I think to solve this problem you need to apply forEach checkboxes work for me, but I cannot display blocks

  <div class="toggle-two">
    <div><small>content 1</small></div>
    <label class="switch-label">
      <input class="switch" id="switch-novice" value="switch-novice"  type="checkbox"/>
       <span class="slider round"></span>
    </label>
  </div>
  
  <div class="toggle-three">
    <div><small>content 2</small></div>
    <label class="switch-label">
      <input class="switch" id="switch-intermediate" value="switch-intermediate"  type="checkbox"/>
      <span class="slider round"></span>
    </label>
  </div>
  
  <div class="toggle-four">
    <div><small>content 3</small></div>
    <label class="switch-label">
      <input class="switch" id="switch-expert" value="switch-expert" type="checkbox" />
      <span class="slider round"></span>
    </label>
  </div>

  <!-- ------------------------------------------- -->
  
  </div>
  <div>
    <div class="content c1"></div>
    <div class="content c2"></div>
    <div class="content c3"></div>
  </div>

**script.js**

let uploadPres = document.getElementsByClassName("content");

$(".content").each(function (index, value) {
  $(`.switch:not([checked])`).on("change", function (param1, param2) {
    $(".switch").not(this).prop("checked", false);

    if ($(".switch").is(":checked")) {
      console.log(this.checked);
    }
  });
});

Initially a class named content has display: none by default

You can also see this example in codesandbox