Fóruns sobre PHP, JavaScript, HTML, MySQLi, jQuery, Banco de Dados, CSS


Moderador: web

 
Avatar do usuário
ADMIN
ADMIN
Tópico Autor
Mensagens: 17586
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Spinner jQuery

27-01-2011 15:15

Spinner é um script em jQuery que permite que você avança ou volte os valores em uma caixa. O script permite trabalhar com números, valores ou lista de itens.

Para demonstração e download acesse

http://docs.jquery.com/UI/Spinner
0
A melhor hospedagem para o seu site HostGator!
 
Primeiras postagens
Primeiras postagens
Mensagens: 4
Nome: Sandro M. Ferreira
Descrição do site: www.smfsoft.com.br
Localização: SC/Florianópolis/Brasil
Contato:

Spinner jQuery

24-02-2011 22:22

Muito interessante este script, porém fui aplicá-lo a um projeto mas só funcionou pra um campo..

É que tenho uma lista dinamica (recordset) que exibe um catálogo de fotos, e cada miniatura exibida tem um form e um campo quantidade. Fui a plicar o Spinner para restringir o campo à multiplos de 50 mas quando o recordset é exibido o Spinner só funciona no primeiro campo. Se alguem puder me dar uma idéia de como eu poderia contornar isto, agradeço muito. De qualquer forma é muito util este recurso,
0
 
Avatar do usuário
ADMIN
ADMIN
Tópico Autor
Mensagens: 17586
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Spinner jQuery

24-02-2011 22:25

Já tentou aplicar o script a class e não ao id do objeto?
0
A melhor hospedagem para o seu site HostGator!
 
Primeiras postagens
Primeiras postagens
Mensagens: 4
Nome: Sandro M. Ferreira
Descrição do site: www.smfsoft.com.br
Localização: SC/Florianópolis/Brasil
Contato:

Spinner jQuery

25-02-2011 00:54

Ainda não, vou fazer isto... thanks!
0
 
Primeiras postagens
Primeiras postagens
Mensagens: 4
Nome: Sandro M. Ferreira
Descrição do site: www.smfsoft.com.br
Localização: SC/Florianópolis/Brasil
Contato:

Spinner jQuery

25-02-2011 01:23

Pois então...

tenho este CSS para o campo (input) quantidade:
<style type="text/css"> .formCart_txtQnt {width:60px; height:18px; border:#999999 1px solid; text-align:right;}

ai no script ficou:
<script src="spinner/jquery-latest.js"></script> <script> $(document).ready(function(){ $("#formCart_txtQnt").spinner({max: 4000, min: 50}); }); </script>

Aqui o CSS do script e mais duas chamadas:
<style type="text/css"> /* UI Spinner */ body { /* background: #fff; */ /* font-family: Arial; */ } label { float: left; margin-right: .5em; padding: .15em 0; font-weight: bold; } .ui-spinner { width: 60px; display: block; position: relative; overflow: hidden; border: 1px solid #999; /* background: #FEFEFE url(../images/spinner-bg.gif) repeat-x left bottom; */ padding: 0 5px; } .ui-spinner-disabled { background: #F4F4F4; color: #CCC; } .ui-spinner-box { width: 90%; height: 100%; float: left; font-size: 125%; border: none; background: none; padding: 0; } .ui-spinner-up, .ui-spinner-down { width: 10%; height: 50%; font-size: 0.5em; padding: 0; margin: 0; z-index: 100; text-align: center; vertical-align: middle; position: absolute; right: 0; cursor: default; border: 1px solid #999; border-right: none; border-top: none; } .ui-spinner-down { bottom: 0; border-bottom: 0; } .ui-spinner-pressed { background: #FEFEFE; } .ui-spinner-list, .ui-spinner-listitem { margin: 0; padding: 0; } </style> <script type="text/javascript" src="spinner/ui.core.js"></script> <script type="text/javascript" src="spinner/ui.spinner.js"></script>

e o campo no formulario esta assim:
<input name="peditem_qnt" type="text" class="formCart_txtQnt" id="peditem_qnt" value="50" maxlength="4" />

E desta vez, nem o primeiro campo apresentou os spinners...

Você pode me ajudar com isto? Ou se tiver uma ideia melhor....
O que preciso é fazer com que o campo numerico quantidade só permita aumentar ou diminuir por meio dos spinners.. por que o valor deve ser multiplo de 50, entao quero aumentar ou diminuir de 50 em 50.. Já alterei o step no arquivo ui.spinner.js para 50, ou seja , pular de 50 em 50 eu ja fiz.. mas o problema é que no repeat region os spinners só funcionam no primeiro campo (quando uso o ID do objeto).

Bem, é isto..

Muito obrigado, desde já..
0
 
Avatar do usuário
ADMIN
ADMIN
Tópico Autor
Mensagens: 17586
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Spinner jQuery

25-02-2011 08:00

De acordo com o script que está no link http://docs.jquery.com/UI/Spinner

Se você copiar ai o exemplo, e pegar lá na linha
$("#s3").spinner();

E adicionar abaixo
$("#novo").spinner();

E no HTML, adicionar

<label for="s3">Items: </label> <ul id="novo"> <li>item 1</li> <li>item 2</li> <li>item 3</li> <li>item 4</li> <li>item 5</li> <li>item 6</li> <li>item 7</li> <li>item 8</li> <li>item 9</li> <li>item 10</li> <li>item 11</li> <li>item 12</li> <li>item 13</li> <li>item 14</li> <li>item 15</li> <li>item 16</li> <li>item 17</li> <li>item 18</li> <li>item 19</li> <li>item 20</li> </ul></p>

Já funciona 2 spinners, independente um do outro.
0
A melhor hospedagem para o seu site HostGator!
 
Primeiras postagens
Primeiras postagens
Mensagens: 4
Nome: Sandro M. Ferreira
Descrição do site: www.smfsoft.com.br
Localização: SC/Florianópolis/Brasil
Contato:

Spinner jQuery

25-02-2011 13:21

Ok, obrigado... vou tentar...
0

Quem está online

Usuários navegando neste fórum: Nenhum usuário registrado