Felder ausblenden

[alexa_]

<td class="menge"> <input name="real" /> </td>
<td class="menge_1"> xx </td>

Das zweite feld soll nur angezeigt werden, wenn in dem ersten etwas drinnen steht. Kann jemand helfen?

 

[B3nnoX]

Du musst die zweite Zeile ein Display: none geben. Dann musst du mit Javascript ein Eventlistener auf das Inputfeld packen. Ich glaube das Event "change", damit wird denn geprüft das sich etwas am Feld ändert. Wenn dies der Fall ist setzt du die zweite Zeile wieder auf display: block

Bin leider nicht so sehr in Javascript bewandert. Aber was hast du denn bis jetzt probiert?

Im Forum wird nicht gern gesehen, wenn man um Hilfe bittet obwohl man noch nichts selbst probiert hat.

 

[Tronjer]

Das ist ganz einfach.

<div ng-app>
  <input type="text" ng-model="myText">
  <p>{{myText}}</p>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script>

 

[B3nnoX]

Ich hatte es so verstanden, dass das td erst angezeigt werden soll wenn etwas im input drin steht. Ups

 

[Tronjer]

Ich hatte es so verstanden, dass das td erst angezeigt werden soll wenn etwas im input drin steht. Ups

Dann eben noch ein ng-if anhängen:

<div ng-app>
  <input type="text" ng-model="myText">
  <p ng-if="myText">{{myText}}</p>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script>

 

[alexa_]

Ausprobiert hab ich das hier. Funktioniert nur leider nicht.

<script type="text/javascript">
        function showtext() {
       if(document.getElementById('realanz').value='') {
                    document.getElementById('diff').style.visibility = 'hidden';
          }
      else {
                    document.getElementById('diff').style.visibility = 'visible';
          }
      }
    </script>

<td class="menge" style="padding-top:1px;padding-bottom:1px;">&ensp;
                        <input id="realanz" type="text" size="4" maxlength="4" class="Anzahlbox" ng-model="mge" onchange="showtext()"/>
                    </td>
                    <td class="menge" id="diff">&emsp;{{Differenz}}</td>

<style type="text/css">
  #diff
    {
      visibility: hidden;
   
    }
</style>

 

[alexa_]

Es funktioniert leider trotzdem nicht.

 

[Tronjer]

Warum poste ich hier eine übernahmefähige Lösung, wenn diese ignoriert wird?

 

[Tronjer]

Insofern muss man dann auch nicht mehr antworten.