Как отправить данные с другого input без использования тега form?

Андрей, если я перенесу $('#sendform input[name="s"]').val(searchTerm); вот сюда:

$('.search-field').keyup(function(eventObject){
	searchTerm = $.trim($(this).val());
	if(eventObject.keyCode == 13){
	$('#sendform input[name="s"]').val(searchTerm);
		goSubmit();
		return;
     } 
	$("#mybutton").click(function(){
		goSubmit();
	}) });

	function goSubmit(){
		$('#sendform').submit();
    }

Кнопка тогда будет отправлять пустые запросы

Как отправить данные с другого input без использования тега form?

Андрей, короче вот так работает, но мне кажется можно упростить ?

jQuery(document).ready(function($){
  $('.myclass').keyup(function(eventObject){
    console.log("!")
    var searchTerm = $(this).val();
    if(searchTerm.length > 2){    
      if(eventObject.keyCode == 13){
          goSubmit(searchTerm);
           return;
      }
      $.ajax({
      url : '/wp-admin/admin-ajax.php',
      type: 'POST',
      data:{
        'action':'',
        'term'  :searchTerm
      },
      success:function(result){
      } });
    }
  $("#mybutton").click(function(){
   if((searchTerm.length) == 0){
      return false;
    } else {
    goSubmit(searchTerm);
    }
	}) });
   function goSubmit(searchTerm){
      $('#sendform input[name="s"]').val(searchTerm);
      $('#sendform').submit();
    }
});

Как отправить данные с другого input без использования тега form?

Андрей, а на примере могли бы показать ?)
Я реально уже запутался, с этой логикой у меня реальные проблемы (

P.S. Хотя бы покажите, как goSubmit() должен передать данные в кнопку )

Как отправить данные с другого input без использования тега form?

Андрей, вот так вообще кнопка ничего не отправляет

jQuery(document).ready(function($){
	$('.myclass').keyup(function(eventObject){
		console.log("!")
		var searchTerm = $(this).val();
		if(searchTerm.length > 2){    
			if(eventObject.keyCode == 13){
				  goSubmit(searchTerm);
				   return;
			}
		  $.ajax({
			url : '/wp-admin/admin-ajax.php',
			type: 'POST',
			data:{
			  'action':'',
			  'term'  :searchTerm
			},
			success:function(result){
			} });
		} });
	$("#mybutton").click(function(){
		goSubmit();
    }) 
   function goSubmit(searchTerm){
		if((searchTerm.length) == 0){
			return false;
		} else {
			$('#sendform input[name="s"]').val(searchTerm);
			$('#sendform').submit();
		}
    } 
});

Как отправить данные с другого input без использования тега form?

Андрей, я вот так сделал, но все равно кнопка почему-то отправляет после ввода и удаления символов

<input class="myclass" placeholder="Поиск" type="text" value="" name="myname" id="search">
<button value="" id="mybutton">Search</button>

jQuery(document).ready(function($){
  $('.myclass').keyup(function(eventObject){
  console.log("!")
    var searchTerm = $(this).val();
    if(searchTerm.length > 2){    
        if(eventObject.keyCode == 13){
              goSubmit(searchTerm);
               return;
         }
      $.ajax({
        url : '/wp-admin/admin-ajax.php',
        type: 'POST',
        data:{
          'action':'',
          'term'  :searchTerm
        },
        success:function(result){
        } });
    } 
   $("#mybutton").click(function(){
if(searchTerm.length == 0) {
      return false;
    } else {
      goSubmit();
    }
    })
   function goSubmit(searchTerm){
      $('#sendform input[name="s"]').val(searchTerm);
      $("#sendform").submit();
    } });
});

Как отправить данные с другого input без использования тега form?

Андрей, тут правильно добавлять ?

$("#mybutton").click(function(){
		if(str.length == 0) {
			return false;
		} else {
			goSubmit();
		}
	})

Как отправить данные с другого input без использования тега form?

Андрей, короче у меня опять возник еще один вопрос
К примеру у меня кнопка отправляет данные, даже если я их удалю из input
Как запретить кнопке отправлять пустые данные, если я удалил в самом input какое-то слово ?

$("#myid").click(function(){
    	goSubmit();
    })

Как в Wordpress реализовать полноценный поиск через Ajax без тега form?

Нет, у меня там совсем другие классы
Я просто тут их не указывал )

P.S. А так я проблему уже решил

Как отправить данные с другого input без использования тега form?

Андрей, спасибо вам, что так понятно все объясняете )
Я сам лично немного разбираюсь, но вот с логикой и последовательностью у меня очень дуго в этом плане :(

Я забыл вам написать, что у меня еще есть 2 функции показа поисковых результатов

$('.myclass').focusin(function() {
		$('.window-ajax-search').fadeIn();
	})
	$('.myclass').focusout(function(){
		$('.window-ajax-search').fadeOut();
    });

Данное окно оформлено в виде данного html класса, под названием window-ajax-search
Оно также выводится при фокусе и снова убирается при убирании с него фокуса мышкой

Я решил данные функции также поместить в прошлый код:

jQuery(document).ready(function($){
  $('.myclass').keyup(function(eventObject){
  console.log("!")
    var searchTerm = $(this).val();
    if(searchTerm.length > 2){    
        if(eventObject.keyCode == 13){
              goSubmit(searchTerm);
               return;
         }
      $.ajax({
        url : '/wp-admin/admin-ajax.php',
        type: 'POST',
        data:{
          'action':'',
          'term'  :searchTerm
        },
        success:function(result){
        } });
    } 
   $("#myid").click(function(){
    	goSubmit();
    })
   function goSubmit(searchTerm){
      $('#sendform input[name="s"]').val(searchTerm);
      $("#sendform").submit();
    } 
$('.myclass').focusin(function() {
		$('.window-ajax-search').fadeIn();
	})
	$('.myclass').focusout(function(){
		$('.window-ajax-search').fadeOut();
    });});
});

Правильно я делаю или как-то можно объединить эти 2 последние блока ?
P.S. Все работает, только вот опять таки возникают некоторые логические доработки (

Как отправить данные с другого input без использования тега form?

Андрей, вот так ?

<input class="myclass" placeholder="Поиск" type="text" value="" name="myname" id="search">
<button value="" id="myid">Search</button>

jQuery(document).ready(function($){
  $('.myclass').keyup(function(eventObject){
  console.log("!")
    var searchTerm = $(this).val();
    if(searchTerm.length > 2){    
        if(eventObject.keyCode == 13){
              goSubmit(searchTerm);
               return;
         }
      $.ajax({
        url : '/wp-admin/admin-ajax.php',
        type: 'POST',
        data:{
          'action':'',
          'term'  :searchTerm
        },
        success:function(result){
        } });
    } 
   $("#myid").click(function(){
    	goSubmit();
    })
   function goSubmit(searchTerm){
      $('#sendform input[name="s"]').val(searchTerm);
      $("#sendform").submit();
    } });
});

Как в Wordpress реализовать полноценный поиск через Ajax без тега form?

Игорь Воротнёв, очень интересная задумка )
Может есть примерная ссылка на статью, где это кто-то так реализует с формами для Wordpress ?

Был был очень рад почитать, просто в видеоуроках на ютубе я про данную тему практически ничего не нашел :(

Как отправить данные с другого input без использования тега form?

Андрей, понял, ваш вариант я смотрел, но мне не очень хочется вызывать по id input

Вот еще вариант, так будет более или менее приемлемее ? Спасибо еще раз

jQuery(document).ready(function($){
var searchTerm = $(this).val();
$('.myclass').keyup(function(eventObject){
console.log("!")
searchTerm = $.trim($(this).val());
if(searchTerm.length > 2){ 
if(eventObject.keyCode == 13){
goSubmit();
return;
}
$.ajax({
url : '/wp-admin/admin-ajax.php',
type: 'POST',
data:{
'action':'',
'term' :searchTerm
},
success:function(result){
} });
} });

function goSubmit(){
$('#sendform input[name="s"]').val(searchTerm);
$("#sendform").submit();
}
});

Как отправить данные с другого input без использования тега form?

Андрей, а как сделать так, чтобы так работало ?

jQuery(document).ready(function($){
  $('.myclass').keyup(function(eventObject){
  console.log("!")
    var searchTerm = $(this).val();
    if(searchTerm.length > 2){    
        if(eventObject.keyCode == 13){
              goSubmit();
               return;
         }
      $.ajax({
        url : '/wp-admin/admin-ajax.php',
        type: 'POST',
        data:{
          'action':'',
          'term'  :searchTerm
        },
        success:function(result){
        } });
    } });
});

function goSubmit(){
  $('#sendform input[name="s"]').val(searchTerm);
  $("#sendform").submit();
}

Как в Wordpress реализовать полноценный поиск через Ajax без тега form?

Игорь Воротнёв,

И да, по уму оно решается вообще без использования формы поиска

А что тогда предложите ?
Писать свой ajax обработчик, когда в Wordpress есть admin-ajax.php ?
Я гуглил и нашел только такой приемлемый вариант )

Как отправить данные с другого input без использования тега form?

Андрей, вот так тоже работает )

jQuery(document).ready(function($){
  $('.myclass').keyup(function(eventObject){
  console.log("!")
    var searchTerm = $(this).val();
    if(searchTerm.length > 2){    
        if(eventObject.keyCode == 13){
              goSubmit();
               return;
         }
      $.ajax({
        url : '/wp-admin/admin-ajax.php',
        type: 'POST',
        data:{
          'action':'',
          'term'  :searchTerm
        },
        success:function(result){
        } });
    } 
   function goSubmit(){
			$('#sendform input[name="s"]').val(searchTerm);
			$("#sendform").submit();
		} });
});

Как такой вариант ?

Как отправить данные с другого input без использования тега form?

Андрей, я заметил, что вот так тоже работает )

jQuery(document).ready(function($){
  $('.myclass').keyup(function(eventObject){
  console.log("!")
    var searchTerm = $(this).val();
    if(searchTerm.length > 2){    
        if(eventObject.keyCode == 13){
              $('#sendform input[name="s"]').val($(this).val());
               $("#sendform").submit();
               return;
         }
      $.ajax({
        url : '/wp-admin/admin-ajax.php',
        type: 'POST',
        data:{
          'action':'',
          'term'  :searchTerm
        },
        success:function(result){
        } });
    } });
});

А как сделать, чтобы (this) работал за пределами функции ?

jQuery(document).ready(function($){
  $('.myclass').keyup(function(eventObject){
  console.log("!")
    var searchTerm = $(this).val();
    if(searchTerm.length > 2){    
        if(eventObject.keyCode == 13){
              goSubmit();
               return;
         }
      $.ajax({
        url : '/wp-admin/admin-ajax.php',
        type: 'POST',
        data:{
          'action':'',
          'term'  :searchTerm
        },
        success:function(result){
        } });
    } });
});

function goSubmit(){
	$('#sendform input[name="s"]').val($(this).val());
	$("#sendform").submit();
}

Как в Wordpress реализовать полноценный поиск через Ajax без тега form?

Игорь Воротнёв, данный код нужен только для динамического поиска и вывода статей из БД без перезагрузки страницы

Если вас устраивает вызов стандартного шаблона (меня просто не устраивает данный вариант) методом get_search_form() на сайте, то данный код вам не нужен )

Как отправить данные с другого input без использования тега form?

Андрей, короче я еще буду дорабатывать, мне кажется где-то у меня есть ошибки ...
Поэкспериментирую еще, потом возможно отпишусь еще раз в данной ветке

Как в Wordpress реализовать полноценный поиск через Ajax без тега form?

Игорь Воротнёв, да я уже разобрался )

Вот так все великолепной ищет статьи и отправляет сабмитом:

jQuery(document).ready(function($){
  $('.myclass').keyup(function(eventObject){
  console.log("!")
    var searchTerm = $(this).val();
    if(searchTerm.length > 2){    
        if(eventObject.keyCode == 13){
              $('input[name="s"]').val($('input[name="s"').val());
               $("#sendform").submit();
               return;
         }
      $.ajax({
        url : '/wp-admin/admin-ajax.php',
        type: 'POST',
        data:{
          'action':'',
          'term'  :searchTerm
        },
        success:function(result){
        } });
    } });
});

Как отправить данные с другого input без использования тега form?

Андрей, как я и писал ранее, вот так великолепно отрабатывает:

jQuery(document).ready(function($){
  $('.myclass').keyup(function(eventObject){
  console.log("!")
    var searchTerm = $(this).val();
    if(searchTerm.length > 2){    
        if(eventObject.keyCode == 13){
              $('input[name="s"]').val($('input[name="s"').val());
               $("#sendform").submit();
               return;
         }
      $.ajax({
        url : '/wp-admin/admin-ajax.php',
        type: 'POST',
        data:{
          'action':'',
          'term'  :searchTerm
        },
        success:function(result){
        } });
    } });
});

Именно по name="s" все ищется, как такое может быть ?

У меня в главном шаблоне формы есть в input name="s" и в header.php с input name="s"

Главный динамический шаблон формы, который находится в searchform.php :

<form id="sendform" action="<?php echo home_url(); ?>/" method="get">
<input class="sidesearch" type="text" name="s" id="search">
</form>

input с кнопкой в header.php

<input class="myclass" placeholder="Поиск" type="text" value="" name="s" id="search">
<button type="submit" value=""></button>

Спасибо, что помогли до конца разобраться, лайки вам везде поставил ;)

P.S. Сохраните примеры ваших кодов на сайте jsfiddlе.net, может тоже кому-то пригодится )