Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript] Dynamiczne dodanie ostylowanego file inputa w jquery
Forum PHP.pl > Forum > Przedszkole
alano
Hej,

Korzystam z niewielkiego kodu w jQuery za pomocą, którego dodaję sobie dodatkowego file inputa. Czyli docelowo wyświetla się 1 file input z przyciskiem "dodaj kolejny", naciśnięcie tego przycisku dodaje drugiego file inputa. Problem polega na tym, że ten file input jest ostylowany za pomocą jQuery uniform - sexy forms (http://uniformjs.com/) i gdy się on dodaje to jest nieostylowany. Dlaczego tak się dzieje? Jak to można rozwiązać?

Kod, który odpowiada za dodanie file inputa:

CODE
var scntDiv = $('#p_scents');
var i = $('#p_scents p').size() + 1;

$('#addScnt').live('click', function() {
$('<p><label for="p_scnts"><input type="file" class="fileInput" id="p_scnt" name="p_scnt_' + i +'" /></label> <a href="#" id="remScnt">Usuń</a></p>').appendTo(scntDiv);
i++;
return false;
});

$('#remScnt').live('click', function() {
if( i > 2 ) {
$(this).parents('p').remove();
i--;
}
return false;
});

$('#addScnt').live('click', function() {
if( i > 3 ) {
$('#addScnt').addClass('disabled-input');
}
return false;
});

$('#remScnt').live('click', function() {

$('#addScnt').removeClass('disabled-input');

return false;
});
piotrex41
A może przy dodawaniu inputa użyj .addClass() w jQuery, który nada mu odpowiednią klasę CSS z odpowiednim stylem?
alano
Tak, patrzę, że input ten jest id i bez klasy jest nadal ostylowany, czyli pewnie uniform zrobił replace-a tego elementu. W kodzie HTML wstawiam coś takiego:
CODE
<input type="file" class="" id="" />


Gdy odpalam stronę to ten skrypt wyświetla coś takiego:

CODE
<div class="uploader">
<input id="" class="" type="file" size="18.5" style="opacity: 0;">
<span class="filename" style="-moz-user-select: none;">Wybierz plik...</span>
<span class="action" style="-moz-user-select: none;">Choose File</span>
</div>
piotrex41
To może spróbuj w CSS dać żeby każdy input type="file" w danym DIVie miał jakiś styl.
  1. div.uploader input[type=file]
  2. {
  3. // style dla inputa
  4. }

Wtedy niezależnie jak dodasz inputa to powinien on odziedziczyć styl z CSSa.
alano
wiesz co, udało mi się smile.gif Znalazłem coś takiego: http://www.mdelrosso.com/sheepit/index.php?lng=en_GB

To chyba działa na innej zasadzie, clone(); i tak pykło.

Dzięki za chęć pomocy smile.gif Może to tobie też się przyda. Pzdr.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.