Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript] wstawienie w input
Forum PHP.pl > Forum > Przedszkole
tenloginjestzajety
Witam
Stosuje do wyszukiwania taki kod, jednak chciałbym zrobić dodatkowo przycisk z tekstem, który wstawia w pole input tekst i wykonuje zdarzenie - zrobiłem tylko wstawienie wartości w polu input, ale nie wiem jak wykonać wyszukiwanie czyli uruchomić kod jquery.

  1. <script>
  2. $(document).ready(function(){
  3. $("#search-box").keyup(function(){
  4. $.ajax({
  5. type: "POST",
  6. url: "../../post.php",
  7. data:'keyword='+$(this).val(),
  8. beforeSend: function(){
  9. $("#search-box").css("background","#FFF url(../../LoaderIcon.gif) no-repeat 2px");
  10. },
  11. success: function(data){
  12. $("#suggesstion-box").show();
  13. $("#suggesstion-box").html(data);
  14. $("#search-box").css("background","#FFF");
  15. }
  16. });
  17. });
  18. });
  19.  
  20. function selectCountry(val) {
  21. $("#search-box").val(val);
  22. $("#suggesstion-box").hide();
  23. }
  24. </script>
  25.  
  26. <script type="text/javascript">
  27. function put(el){
  28. tekst = el.name;
  29. document.getElementById('search-box').value += tekst;
  30. }
  31. </script>


dzięki
trueblue
http://api.jquery.com/trigger/
tenloginjestzajety
  1. <script>
  2. $(document).ready(function(){
  3. $("#button").trigger(function(){
  4. $.ajax({
  5. type: "POST",
  6. url: "../../post.php",
  7. data:'keyword='+$(this).val(), // jak tutaj wprowadzić wartość z przycisku zamiast keyworda? Mam kilka przycisków.
  8. beforeSend: function(){
  9. $("#search-box").css("background","#FFF url(../../LoaderIcon.gif) no-repeat 2px");
  10. },
  11. success: function(data){
  12. $("#suggesstion-box").show();
  13. $("#suggesstion-box").html(data);
  14. $("#search-box").css("background","#FFF");
  15. }
  16. });
  17. });
  18. });
  19.  
  20. function selectCountry(val) {
  21. $("#search-box").val(val);
  22. $("#suggesstion-box").hide();
  23. }
  24. </script>
trueblue
A gdzie jest teraz obsługa #search-box?
tenloginjestzajety
Nie mogę zaskoczyć jak działa trigger.. Łączy z bazą, ale nie ma zapytania.
  1. <script>
  2. $(document).ready(function(){
  3. $("#button").click(function(){
  4. $.ajax({
  5. type: "POST",
  6. url: "../../post.php",
  7. data:$(this).val(),
  8. beforeSend: function(){
  9. $("#search-box").css("background","#FFF url(../../LoaderIcon.gif) no-repeat 2px");
  10. },
  11. success: function(data){
  12. $("#suggesstion-box").show();
  13. $("#suggesstion-box").html(data);
  14. $("#search-box").css("background","#FFF");
  15. }
  16. });
  17. });
  18. });
  19.  
  20. function selectCountry(val) {
  21. $("#search-box").val(val);
  22. $("#suggesstion-box").hide();
  23. }
  24. </script>
trueblue
Pierwszy przykład w dokumentacji pokazuje jak działa trigger.
tenloginjestzajety
działa, dzięki.

Ps. pytanie tylko od strony technicznej, bo mam kilka przycisków - utworzyłem wspólna klasę dla wszystkich przycisków, a tekst pobiera z value. Czy to dobre rozwiązanie? Nie wiem jak połączyć, aby było również wyszukiwanie po wpisaniu znaków, a nie chcę dwóch kodów.

$("#search-box").keyup(function()

  1. $(".button").on( "click", function() {
  2. $("#search-box" ).val( $( this ).val() );

trueblue
Dobre rozwiązanie.

Aby było wyszukiwanie po wpisaniu znaków do jakiego elementu?
tenloginjestzajety
No właśnie nie mogę sobie poradzić z połączeniem dwóch funkcji "click" oraz "keyup".

Tak wszystko działa, tylko pod względem optymalizacji, klapa.
  1. <script>
  2. $(document).ready(function(){
  3. $("#search-box").keyup(function() {
  4. $.ajax({
  5. type: "POST",
  6. url: "../../post.php",
  7. data:'keyword='+$(this).val(),
  8. beforeSend: function(){
  9. $("#search-box").css("background","#FFF url(../../LoaderIcon.gif) no-repeat 2px");
  10. },
  11. success: function(data){
  12. $("#suggesstion-box").show();
  13. $("#suggesstion-box").html(data);
  14. $("#search-box").css("background","#FFF");
  15. }
  16. });});
  17. $(".button").on( "click", function() {
  18. $.ajax({
  19. type: "POST",
  20. url: "../../post.php",
  21. data:'keyword='+$(this).val(),
  22. beforeSend: function(){
  23. $("#search-box").css("background","#FFF url(../../LoaderIcon.gif) no-repeat 2px");
  24. },
  25. success: function(data){
  26. $("#suggesstion-box").show();
  27. $("#suggesstion-box").html(data);
  28. $("#search-box").css("background","#FFF");
  29. }
  30. });
  31. });
  32. });
  33.  
  34. function selectCountry(val) {
  35. $("#search-box").val(val);
  36. $("#suggesstion-box").hide();
  37. }
  38. </script>
trueblue
W ogóle nie używasz trigger.
tenloginjestzajety
trigger( "click" ); - próbuje wstawić w keyup, ale bezskutecznie..

  1. <script>
  2. $(document).ready(function(){
  3.  
  4. $(".button").on( "click", function() {
  5. $("#search-box" ).val( $( this ).val() );
  6. });
  7.  
  8. $("#search-box").keyup(function() {
  9. $.ajax({
  10. type: "POST",
  11. url: "../../post.php",
  12. data:'keyword='+$(this).val(),
  13. beforeSend: function(){
  14. $("#search-box").css("background","#FFF url(../../LoaderIcon.gif) no-repeat 2px");
  15. },
  16. success: function(data){
  17. $("#suggesstion-box").show();
  18. $("#suggesstion-box").html(data);
  19. $("#search-box").css("background","#FFF");
  20. }})});
  21. });
  22.  
  23. function selectCountry(val) {
  24. $("#search-box").val(val);
  25. $("#suggesstion-box").hide();
  26. }
  27. </script>
trueblue
Chcesz wywołać szukanie na inpucie po wstawieniu tekstu, a nie wpisaniu, tak? Tak.
Jakie zdarzenie jest wywoływane przy wpisywaniu tekstu?
Jaki więc trigger należy wywołać?
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.