Új hozzászólás Aktív témák

• Sk8erPeter nagyúr

  #2696

  #2695 trisztan94

  2012-07-01 21:06:07

  Új Válasz

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  

  Sk8erPeter

  nagyúr

  #2695 trisztan94

  #2695 trisztan94

  Sziasztok!

  Olyat szeretnék, hogy van egy file inputom, megcsinálva, hogy egy textboxban jelenjen meg, igazából nehéz elmagyarázni. Az elérési útvonal egy text inputban van, a lényeg az lenne, hogy amíg üres, tehát nem lett fájl tallózva, addig display:none; legyen, ha került bele adat, tehát a tallózás megvolt, akkor meg display:inline;

  itt a html:
  <input type="text" id="fileName" class="file_input_textbox" readonly="readonly">
  
  <div class="file_input_div">
  <input id="fileInputButton" type="button" value="Tallózás" class="file_input_button" />
  <input type="file" class="file_input_hidden"
  onchange="javascript: document.getElementById('fileName').value = this.value"
  onmouseover="document.getElementById('fileInputButton').className='file_input_button_hover';"
  onmouseout="document.getElementById('fileInputButton').className='file_input_button';" /></div>

  Szóval a legfelső az amiről beszéltem.

  itt a javascript:
  window.onload = function() {
  var textbox = document.getElementById('fileName');
  if (textbox.value == null)
  {
  textbox.style.display = 'none';
  }
  else
  {
  textbox.style.display = 'inline';
  }
  }

  Köszönöm szépen!

  

  Szerintem a File Style Plugin for jQuery-ből meríthetnél ötletet, ez egy külön szövegdobozt hoz létre a tallózott fájl elérési útjának megmutatására.
  Korábban készítettem róla egy demót jsFiddle-re, itt ha megnyomod a gombot, akkor átvált az új stílusra:
  http://jsfiddle.net/Sk8erPeter/JEVgF/

  Szerk.:
  egyébként itt a pluginben igazából ennyi a "nagy" trükk, ha ezt megnézed:

  var filename = $('<input class="file">')
  .addClass($(self).attr("class"))
  .css({
  "display": "inline",
  "width": settings.width + "px"
  });
  
  // .........
  
  $(self).bind("change", function() {
  filename.val($(self).val());
  });

  (A kipontozott résznél van még egy-két dolog.)
  Így tehát amikor kiválasztod a fájlt, akkor a filename nevű inputelem (ami egy textfield) értéke megváltozik a fájl elérési útjára.
  Itt a "self" az a fájltallózó inputelem lesz, amire beállítod a File Style Plugint.
  Persze ahhoz, hogy ezt jobban értsd, valamennyire a jQuery alapjaival tisztában kell lenni.
  Ha ez megvan, onnantól elég könnyű megoldani a feladatodat.

Új hozzászólás Aktív témák