Avatar billede Slettet bruger
19. maj 2018 - 18:23 Der er 8 kommentarer

Optimering af kode

Hej,

Er det muligt at få nedenstående kodestump optimeret? Jeg vil gerne have vist nogle checkboxe, og det har egentligt fungeret fint med følgende kode:

--- FUNGERER ---
if(date.status){
                    tbody += '<td align="left" style="width:10%;"> <input type="checkbox" class="custom-control-input" name="member_'+item.id+'[]" value="'+date.date_id+'" checked></td>';
                  }else{
                    tbody += '<td align="left" style="width:10%;"> <input type="checkbox" class="custom-control-input" name="member_'+item.id+'[]" value="'+date.date_id+'"></td>';
                  }

Jeg vil dog gerne have lavet det således at de checkboxe der hører til en dato der er overskredet, skal være være disabled. Jeg har prøvet mig lidt frem med nedenstående kode, og det fungerer egentligt - dog får jeg mange flere checkboxe end tidligere. Det virker som om at koden fordobler antallet... Hvad gør jeg galt?


--- FUNGERER IKKE ---
if((item.date >= today) === true) {
                  if(date.status) {
                      tbody += '<td align="left" style="width:10%;"> <input type="checkbox" class="custom-control-input" name="member_'+item.id+'[]" value="'+date.date_id+'" checked></td>';
                    }else{
                      tbody += '<td align="left" style="width:10%;"> <input type="checkbox" class="custom-control-input" name="member_'+item.id+'[]" value="'+date.date_id+'"></td>';
                    }
                }
                if ((item.date < today) === true) {
                  if(date.status) {
                      tbody += '<td align="left" style="width:10%;"> <input type="checkbox" class="custom-control-input" name="member_'+item.id+'[]" value="'+date.date_id+'" checked disabled="disabled"></td>';
                    }else{
                      tbody += '<td align="left" style="width:10%;"> <input type="checkbox" class="custom-control-input" name="member_'+item.id+'[]" value="'+date.date_id+'" disabled="disabled"></td>';
                    }
                }
Avatar billede Slettet bruger
20. maj 2018 - 16:37 #1
Ingen bud? :-/
Avatar billede S. Enevoldsen Juniormester
21. maj 2018 - 17:43 #2
Sikker på du ikke har noget gammelt kode som også kører? Medmindre du fået nogle mærkelige resultater (som NaN-agtigt noget) i dine ifs burde du ikke få flere resultater. Så prøv eventuelt at logge dine if-conditions. Ellers her er et bud der undgår ifs, så hvis du stadig får for mange linjer er det fordi du kører koden dobbelt:


var disableText = item.data >= today ? '' : ' disabled="disabled"';
var checkedText = date.status ? ' checked="checked"' : '';
var tdText = [
    '<td align="left" style="width:10%;">',
    '<input type="checkbox" class="custom-control-input" name="member_', item.id, '[]"',
    ' value="', date.date_id, '"',
    checkedText,
    disableText,
    '></td>'   
].join('');
tbody += tdText;
Avatar billede S. Enevoldsen Juniormester
21. maj 2018 - 17:44 #3
Her er en paste i stedet med indrykning: https://paste.ee/p/X3LeO
Avatar billede Slettet bruger
21. maj 2018 - 20:36 #4
Jeg kan stadig ikke få det til at fungere - din kode giver samme resultat.

Hermed hele mit script:
    <script type="text/javascript">
      $(document).ready(function () {
        $("#createMember").click(function(){
          var data = $("#memberForm").serialize();
          $.post("savemember.php", {'data': data}, function(json){
          });
        });

        $("#save_workouts").click(function(){
          var data = $("#myForm").serialize();
          $.post("savedata.php", {'data': data}, function(json){
          });
        });
       
        $("#team").change(function () {
          var team = $("#team").val();
          $.get( "json.php", {action: "members", hold: team}, function( data ) {

            var dates = '';
            $.each(data.dates, function (index, item) {
              dates += '<th class="dynamic_date">' + item.date + '</th>';
            });

            var tbody = '';
            var myVar = 1;
            $.each(data.members, function (index, item) {
              tbody += '<tr>';
              tbody += '<td align="left">' + myVar++ + '</td>';
              tbody += '<td align="left">' + '<a href="#myModal" data-toggle="modal" data-target="#edit-modal" id="' + item.id + '">' + item.fornavn + ' ' + item.efternavn +'</a></td>';
              tbody += '<td align="left">' + item.age + '</td>';
             
              $.each(item.workouts, function (index, date) {
                $.each(data.dates, function (index, item) {
                var today = new Date();
                var dd = today.getDate();
                var mm = today.getMonth()+1; //January is 0!
                var yyyy = today.getFullYear();
               
                if(dd<10) {
                    dd = '0'+dd;
                }
               
                if(mm<10) {
                    mm = '0'+mm;
                }
               
                today = dd + '-' + mm + '-' + yyyy;
                var disableText = item.date >= today ? '' : ' disabled="disabled"';
                var checkedText = date.status ? ' checked="checked"' : '';
                var tdText = [
                    '<td align="left" style="width:10%;">',
                    '<input type="checkbox" class="custom-control-input" name="member_', item.id, '[]"',
                    ' value="', date.date_id, '"',
                    checkedText,
                    disableText,
                    '></td>'   
                ].join('');
                tbody += tdText;
                });
              });

              tbody += '<td></td>';
              tbody += '</tr>';
            });

            // Remove old dates...
            $(".dynamic_date").remove();
            // Add new dates
            $(dates).insertBefore("#numbers_of");
            // Add members to team
            $('#myTable tbody').html(tbody);
          }, 'json');
        });
      });
    </script>

Billede fra systemet: https://ibb.co/eU1hAo Som du kan se på billedet, så bør der kun være checkboxes under datoerne, men der er mange flere...
Har du nogle idéer?
Avatar billede S. Enevoldsen Juniormester
22. maj 2018 - 01:07 #5
Du har 3 nested løkker:

$.each(data.members, function(index, item) {
.....// Ny række
.....$.each(item.workouts, function(index, date) {
..........
..........$.each(data.dates, function(index, item) {
...............// Ny "checkbox kolonne.

Hvis du kigger på dit billede kan du se at der er 5 checkboxes i starten, som gentager sig yderligere 4 gange. Læg her mærke til at det kan vi se ved at kun den første i 5-grupperinger ikke er disabled. Det tyder på at

var disableText = item.date >= today ? '' : ' disabled="disabled"';

gentager sig selv hver 5-gang. Det tyder på at data.dates er 5 stor. Den data der bliver brugt her, item.date (og today), har ikke noget med item.workouts at gøre (den løkke der ligger rundt om). Givet at vi får 25 kolonner, tyder på at item.workouts er 25 / 5 = 5 stor også.

Så for at opsummere:

.... - Før du begynder på de 3 nested løkker, laver du LENGTH(data.dates)  (her 5) th-headers baseret på: data.dates.
.... - Så, baseret på de indre løkker, laver du:
.......... LENGTH(item.workouts) * LENGTH(data.dates) = (5 * 5 = 25) kolonner
..........  , baseret på blandet én item.workout og én data.dates.

Jeg gætter på at enten skulle:

$.each(data.dates, function(index, item) {

have været:

$.each(date.dates, function(index, item) {

Eller også har du lavet en logisk fejl andet sted. Men jeg håber mit skriveri kan hjælpe med forstå hvor fejlen opstår.
Avatar billede Slettet bruger
22. maj 2018 - 22:51 #6
Jeg kan ikke rigtigt finde en løsning ud fra det du skriver?

Vil nedenstående fil-indhold hjælpe med en forståelse? Det er heller ikke hver gang at det er muligt at gemme data i databasen - ofte problematisk når man tilgår siden via en mobil eller tablet.

JSON:
<?php
require('connection.php');
$json = array();

$action = isset($_GET['action']) ? $_GET['action'] : false;

switch($action){
  case 'members':
    $hold = isset($_GET['hold']) ? intval($_GET['hold']) : 0;

    # Aldersgrupper
    $ages = array();
    if ($result = $conn->query("SELECT * FROM tbl_age ORDER BY id")){
      while ($row = $result->fetch_object()){
        $age = array(
          'name' => $row->name,
          'from' => $row->age_from,
          'to' => $row->age_to
        );
        $ages[] = $age;
      }
      $result->close();
    }

    $dates_id = array();
    $members_id = array();
     
    # Næste træninger
    $dates = array();
   
    if ($stmt = $conn->prepare("SELECT `id`, `date`
      FROM `tbl_traeninger`
      WHERE `date` >= CURDATE() AND hold_id = ?
      ORDER BY date LIMIT 1")) {
      $stmt->bind_param("i", $hold);
      $stmt->execute();
      $stmt->bind_result($id, $date);
      while ($stmt->fetch()){
        $my_date = array(
          'id' => $id,
          'date' => date('d-m-Y', strtotime($date)),
        );
        $dates_id[] = $id;
        $dates[] = $my_date;
      }
      $result->close();
    }
   
    $useragent=$_SERVER['HTTP_USER_AGENT'];
    if(!preg_match('/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i',$useragent)||preg_match('/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i',substr($useragent,0,4)))
        {
          if ($stmt = $conn->prepare("SELECT `id`, `date`
          FROM `tbl_traeninger`
          WHERE `date` < CURDATE() AND hold_id = ?
          ORDER BY date DESC LIMIT 4")) {
          $stmt->bind_param("i", $hold);
          $stmt->execute();
          $stmt->bind_result($id, $date);
          while ($stmt->fetch()){
          $my_date = array(
          'id' => $id,
          'date' => date('d-m-Y', strtotime($date)),
          );
          $dates_id[] = $id;
          $dates[] = $my_date;
          }
        $result->close();
        }
        }

    $today = new DateTime('today');

    $members = array();
    # Members
    if ($stmt = $conn->prepare("SELECT
      tm.id,
      tm.fornavn,
      tm.efternavn,
      tm.dob
    FROM tbl_medlem tm
    INNER JOIN tbl_map_medlem_hold tmmh
    ON tm.id = tmmh.medlem_id
    WHERE tmmh.hold_id = ? ORDER BY tm.fornavn, tm.efternavn")) {
      $stmt->bind_param("i", $hold);

      $stmt->execute();

      $stmt->bind_result($id, $fornavn, $efternavn, $dob);

      while ($stmt->fetch()){
        $member = array();
        $member['id'] = $id;
        $members_id[] = $id;
        $member['fornavn'] = $fornavn;
        $member['efternavn'] = $efternavn;

        # Calculate age       
        $dob = new DateTime($dob);
        $age1 = $dob->diff($today)->y;
        $member['age'] = $age1;
       
        foreach($ages as $a){
          if($age >= $a['from'] && $age <= $a['to']){
            $member['age_group'] = $a['name'];
          }
        }
        $members[] = $member;
      }
      $stmt->close();
    }

    $workouts_status = array();
    # Workout status
    if($result = $conn->query("SELECT medlem_id, training_id FROM `tbl_map_medlem_traeninger` WHERE `medlem_id` IN (".implode(',', $members_id).") AND `training_id` IN (".implode(',', $dates_id).")")){
      while ($row = $result->fetch_object()){
        $medlem_id = $row->medlem_id;
        $training_id = $row->training_id;
        if(array_key_exists($medlem_id, $workouts_status)){
          $workouts_status[$medlem_id][] = $training_id;
        }else{
          $workouts_status[$medlem_id] = array($training_id);
        }
      }
    }

    # DEBUG
    #$json['workouts_status'] = $workouts_status;

    $new_members = array();
    # Number of workouts
    foreach($members as $member){
      $member_id = $member['id'];
      $antal = 0;
      if ($stmt = $conn->prepare("SELECT
        count(*) AS antal
        FROM `tbl_traeninger` tt
        INNER JOIN `tbl_map_medlem_traeninger` tmmt
        ON tmmt.training_id = tt.id
        WHERE tt.hold_id = ? AND tmmt.medlem_id = ?")) {
        $stmt->bind_param("ii", $member_id, $hold);
        $stmt->execute();
        $stmt->bind_result($antal);
        $stmt->fetch();
      }
      $member['antal'] = $antal;

      $workout_status = array();
      foreach($dates as $date){
        $date_id = $date['id'];
        $date_status = FALSE;
        if(array_key_exists($member_id, $workouts_status)){
          if(in_array($date_id, $workouts_status[$member_id])){
            $date_status = TRUE;
          }
        }
        $workout_status[] = array('date_id' => $date_id, 'status' => $date_status);
      }
      $member['workouts'] = $workout_status;
      $new_members[] = $member;
    }

    $json['members'] = $new_members;
    $json['dates'] = $dates;
    break;
}
$conn->close();
header("Content-type:application/json");
echo json_encode($json);
?>

INDEX:
    <script type="text/javascript">
      $(document).ready(function () {
        $("#createMember").click(function(){
          var data = $("#memberForm").serialize();
          $.post("savemember.php", {'data': data}, function(json){
          });
        });

        $("#save_workouts").click(function(){
          var data = $("#myForm").serialize();
          $.post("savedata.php", {'data': data}, function(json){
          });
        });
       
        $("#team").change(function () {
          var team = $("#team").val();
          $.get( "json.php", {action: "members", hold: team}, function( data ) {

            var dates = '';
            $.each(data.dates, function (index, item) {
              dates += '<th class="dynamic_date">' + item.date + '</th>';
            });

            var tbody = '';
            var myVar = 1;
            $.each(data.members, function (index, item) {
              tbody += '<tr>';
              tbody += '<td align="left">' + myVar++ + '</td>';
              tbody += '<td align="left">' + '<a href="#myModal" data-toggle="modal" data-target="#edit-modal" id="' + item.id + '">' + item.fornavn + ' ' + item.efternavn +'</a></td>';
              tbody += '<td align="left">' + item.age + '</td>';
             
              $.each(item.workouts, function (index, date) {
                $.each(data.dates, function (index, item) {
                  var today = new Date();
                  var dd = today.getDate();
                  var mm = today.getMonth()+1;
                  var yyyy = today.getFullYear();
                 
                  if(dd<10) {
                      dd = '0'+dd;
                  }
                 
                  if(mm<10) {
                      mm = '0'+mm;
                  }
                 
                  today = dd + '-' + mm + '-' + yyyy;
                  var disableText = item.date >= today ? '' : ' disabled="disabled"';
                  var checkedText = date.status ? ' checked="checked"' : '';
                  var tdText = [
                      '<td align="left" style="width:10%;">',
                      '<input type="checkbox" class="custom-control-input" name="member_', item.id, '[]"',
                      ' value="', date.date_id, '"',
                      checkedText,
                      disableText,
                      '></td>'   
                  ].join('');
                  tbody += tdText;
                });
              });

              tbody += '<td></td>';
              tbody += '</tr>';
            });

            $(".dynamic_date").remove();
            $(dates).insertBefore("#numbers_of");
            $('#myTable tbody').html(tbody);
          }, 'json');
        });
      });
    </script>

SAVEDATA:
<?php
require('connection.php');
$json = array();

$params = array();
parse_str($_POST['data'], $params);

$json['params'] = $params;
foreach($params as $key => $value){
  $member = str_replace("member_", "", $key);
  foreach($value as $workout){
    if ($stmt = $conn->prepare("INSERT INTO `tbl_map_medlem_traeninger`
      VALUES(null,?,?)")) {
      $stmt->bind_param("ii", $member, $workout);
      $stmt->execute();
      $stmt->close();
    }
  }
  $json['status'] = "Members updated";
}

$conn->close();
header("Content-type:application/json");
?>
Avatar billede S. Enevoldsen Juniormester
23. maj 2018 - 00:28 #7
Uden at vide det ønskede resultat er det umuligt at sige hvad løsningen burde være. Jeg prøvede at udlede det JSON som du får og kom frem til noget der minde om følgende skema:

dates (1 fremtid, 4 fortid):
....id
....date

member:
....id
....fornavn
....efternavn
....age
....antal  (af træninger blandt de 5 dates)
....workouts:
........date_id
........status (for date_id)
........id (member)

Så, som jeg forstår det:
(1) For et hold, udvælges 5 træningsdage, 1 i fremtiden og 4 i fortiden,
(2) For holdet udtrækker du alle medlemmerne af holdet,
(3) Så udtrækker du alle de workouts hvor mindst et holdmedlem trænede på den dato, og huske det
(4) Går gennem hvert medlem og udvælger de workouts som involverer medlemmet, og marker om medlemmet var til den pågældende workout - ikke helt sikker på hvad der sker her.

Lige nu, når du genererer tabellen går du igennem hver data to laver en th - hvilket er fint.

Bagefter, går du gennem hver medlem for at lave en række. Når du skal lave kolonnerne, har du de to løkker der er nested, den ene går gennem alle workouts, den anden alle datoer, og det er her du får det uønskede resultat.

Hvis jeg forstår korrekt, er det ønskede resultat at du får hver dato indikerer om medlemmet var der, samt marker den som 'disabled' hvis det er i fortiden. Så i stedet for de 2 indre løkker, er målet at gå igennem de datoer du har lavet th's for, dvs. 'data.dates' og så for hver dato tjekke om spilleren var der til den givne workout, og i så fald markere den som afkrydset.

Så i stedet kan du prøve at:

- Iterér gennem hver dato igen, data.dates som 'date' for at lave et td-element.
- Check om datoen er i fremtiden for at få 'disabled' status.
- Check om det givne member (item), har en item.workouts hvor date.id == item.workouts[x].date_id
... - Hvis ja, så aflæs, item.workouts[x].status og hvis 'true' så sæt kryds
... -  ellers sæt ingen kryds
Avatar billede Slettet bruger
23. maj 2018 - 09:44 #8
Hej igen,

Du har forstået det fuldstændig korrekt :-)

"Så i stedet kan du prøve at:

- Iterér gennem hver dato igen, data.dates som 'date' for at lave et td-element.
- Check om datoen er i fremtiden for at få 'disabled' status.
- Check om det givne member (item), har en item.workouts hvor date.id == item.workouts[x].date_id
... - Hvis ja, så aflæs, item.workouts[x].status og hvis 'true' så sæt kryds
... -  ellers sæt ingen kryds"


Jeg er helt sikker på at det du skriver kan komme til at give mening for mig i forhold til at opnå det ønskede resultat, MEN jeg er ikke specielt øvet i programmeringens ædle kunst, så har du mulighed for at komme med nogle konkrete kodeeksempler jeg kan bruge/arbejde videre med?

På forhånd MANGE tak :-)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester