2017-07-15 9 views
-1

"loadStaff"関数を使用してPHPスクリプトを実行するとき、浮動ラベルが動作しなくなる以下のコードに問題があります。浮動ラベルは、PHPスクリプトの実行前に動作します。私の限られた知識では、問題はオプション選択値が角度モデルに渡されないことによって引き起こされることが示唆されています。これはオプション選択が選択値($('select#account_list').val('<?php echo $_POST['account_list'];?>')を保持しているので浮動ラベルをトリガーしませんでした。ただし、オプション選択フィールドで選択した値が表示されていても、フローティングラベルは実行されません。選択した値を浮動ラベルをトリガーする角度モデルにどのように渡しますか?私は私の推論で間違っている可能性があります。浮動ラベルをトリガするオプションを角度モデルに渡してオプションを渡す

<div ng-app="myApp"> 
     <form id="orderformstaff" action="<?php echo $_SERVER['PHP_SELF'];?>" method="post" enctype="multipart/form-data"> 
     <div class="field" style="width: 100%"> 
      <label class="show-hide" ng-show="account">Account</label> 
      <div class="input-group mb-4"> 
      <span class="input-group-addon gi gi-user-key"></span> 
      <select id="account_list" class="form-control custom-select" name="account_list" ng-model="account" onchange="loadStaff()" autocomplete="on" required/> 
       <?php 
       $a_list = $DB_CON_A->query("SELECT `id`, `email` FROM `staffs` ORDER BY `id` ASC"); 
       $data_row = '<option value="" disabled>Choose an account</option>'; 
       if($a_list !== false) { 
        foreach($a_list as $row){ 
        $data_row .= '<option value="'.$row['email'].'">'.$row['email'].'</option>'."\n"; 
        } 
       } 
       unset($row); 
       echo $data_row; 
       ?> 
      </select> 
      </div> 
     </div> 
     </form> 
    </div> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular-animate.js"></script> 
    <script> var myApp = angular.module('myApp', ['ngAnimate']);</script> 
    <script> 
     function loadStaff() { 
     var form = 
     document.getElementById('orderformstaff'); 
     form.submit(); 
     }; 
    </script> 
    <script type="text/javascript"> <!--allows option select to retain value after executing loadStaff--> 
     $(document).ready(function(){ 
     $('select#account_list').val('<?php echo $_POST['account_list'];?>'); 
     }); 
    </script> 

答えて

0

実際には、AngularJSを使用する必要はありません。なぜなら、PHPでのすべてのジョブは実行されたからです。あなたが現在のコードを修正したい場合に使用したい場合はしかし

REMOVE

$('select#account_list').val('<?php echo $_POST['account_list'];?>'); 

がTHEN select要素の属性

<select id="account_list" class="form-control custom-select" ng-init="account = <?php echo $_POST['account_list'];?>" name="account_list" ng-model="account" onchange="loadStaff()" autocomplete="on" required/> 

EDIT

  1. 設定

    AngularJS y ouはPHPではなく、anglejsとデータをバインドする必要があります。

  2. 何jQueryのが存在しない場合は、.readyなど$(文書)を使用することはできません...

あなたはAngularJSを学び始めたい場合は、あなたがここにhttp://www.journaldev.com/7750/angularjs-simple-forms-tutorial それは背中にPHPを使用してから開始することができます-終わり。

+0

ありがとうございました。残念ながら、それは動作しませんでした。 $( 'select#account_list')を削除する。val( '<?php echo $ _POST [' account_list '];?>');オプション選択は初期値に戻るので、実際にはスクリプトを実行した後にオプション選択値を保持しません。 – javystar

+0

あなたの提案に基づいて、 - > $ data_row。= '

+0

申し訳ありませんが、このフォームが必要な場合は、anglejsを使用しないでください。 jqueryを使用すると簡単になります。しかし、angular.jsを学ぼうとすると、私はいくつかの提案をすることができます。 –

関連する問題