dimanche 20 décembre 2020

If..,else.. in javascript

I am trying to solve my problem with if-else in Javascript. I would highly appreciate your help.

I wanted to filter the name via gender, also safe the keys - woman / man to local storage.

But I can not find out how to make if-else clause.

Can someone help me?

There is also the link: https://drive.google.com/file/d/1RNJxbiU_DsFTCqGJWgxpepCgdOhGuzIj/view?usp=sharing

Thanks a lot, it means world to me, I am new here. :-)

$(document).ready(function() {

  function displayName() {

    let safeNameVal = localStorage.getItem('woman');
    let safeName;

    if (safeNameVal) {
      safeName = JSON.parse(safeNameVal);
    } else {
      safeName = [];
    }

    //find list
    let nameUl = $('#list_2');
    nameUl.empty(); //.html('')

    //making list 
    $.each(safeName, function(key, name) {

      let nameLi = $('<li></li>');
      nameLi.text(name);

      //remove link
      let jmenoRemoveLink = $('<a href="#">x</a>');
      jmenoRemoveLink.click(function(e) {
        e.preventDefault();
        //name
        let safeNameVal = localStorage.getItem('woman');
        let safeName;
        if (safeNameVal) {
          safeName = JSON.parse(safeNameVal);
        } else {
          safeName = [];
        }
        //remove
        safeName.splice(key, 1);
        //safe name
        localStorage.setItem('woman', JSON.stringify(safeName));
        //display name
        displayName();
      });

      nameLi.append(jmenoRemoveLink);

      nameUl.append(nameLi);
    });

  }

  $('#formular').submit(function(e) {

    e.preventDefault();

    let zadaneJmeno = $('#name').val();
    if (zadaneJmeno) {
      //safe
      let safeNameVal = localStorage.getItem('woman');
      let safeName;

      if (safeNameVal) {
        safeName = JSON.parse(safeNameVal);
      } else {
        safeName = [];
      }
      safeName.push(zadaneJmeno);

      localStorage.setItem('woman', JSON.stringify(safeName)); /// ["Tom"]

      //list
      displayName();
      $('#name').val('');
    } else {
      // alert
      alert('please enter the name"');
      $('#name').focus();
    }

  });

  $('#removeAll').click(function() {
    localStorage.setItem('woman', '[]'); ///localStorage.setItem('woman', JSON.stringify([]));
    displayName();
  });


  displayName();

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="formular">

  <label for="name">Enter the name</label>
  <input type="text" id="name" required />
  <label for="section">Gender</label>

  <select name="selectSection" id="section" required>
    <option value="">---</option>
    <option value="man" id="man">man</option>
    <option value="woman" id="woman">woman</option>

  </select>
  <input type="submit" value="add" />
</form>

<button id="removeAll">Remove</button>

<div id="man_div">
  <h1>man:</h1>
  <ul id="list"></ul>

</div>


<div id="woman_div">
  <h1>woman:</h1>
  <ul id="list_2"></ul>

</div>

Aucun commentaire:

Enregistrer un commentaire