I added a custom html block on my wordpress.com site and wrote a simple bit of code to act as a search widget.
I've tried many things. I tried making button run a script function, I tried making the function listen for the button, I tried using a a href link (maybe woud work if I tried harder).
<input type="text" id="input" value="Search...">
<br>
<button onclick="window.location.href = 'https://vinelings.home.blog/?s=' + document.getElementById('input').value">🔎 Search</button>
I want it to make the button grab the input text then redirect the tab the search for that term.
Not sure if this is a wordpress.com problem, if it is can i get around it in any way?
Code: https://imgur.com/iRvb29V.jpg
Result: https://imgur.com/GUcwIg9.jpg
EDIT:
I am using the Custom HTML block.
My theme is ALtoFocus.
You need to put your html markup into custom html block
Related
I have 4 links. Previously implemented as A tags.
My goal is to switch the request method (GET) with POST. Everything else have to remain the same!
The problem - it must be implemented using pure HTML - to be exact - no ajax and no window.open().
My solution is half way there. Hopefully to get a creative second half from you (impossible is also an answer)
Here is the (simplified) HTML:
<form
id = "resultsForm"
target="_blank"
action="http://example.com"
method="post"
>
<input type="hidden" name="data" value="someData">
<button type="submit" value="submit">
<p class="contextual"> title </p>
<span></span>
</button>
</form>
Now, it looks and feels like the old implementation and also sends POST requests
But - contrary to a link - a button can't be middle clicked or opened in new window when right clicking on it (by default...)
Can I somehow wrap it in an A tag to achieve the explained behavior without using js events or be conflicted with form subbmission?
Your help is really appreciated
No, this is impossible.
Anchor elements cannot contain interactive elements such as button elements.
Forms should be posted to the target window, so a normal click on the submit button, by virtue of the _blank value, should open an unnamed browsing context (a new window or tab).
Users should be accustomed to not middle-clicking on buttons, although there is a habit of developers to style links to look like buttons, throwing off users' expectations (end rant:)).
So the idea is just to have this switch pages to "explore.html" when it clicked but I've been trying to get it to work for hours and it won't. I've tried changing it to a "href=()" and it didn't work either. Do I just write it as an instead of a ?click here to see the code I'm having trouble with...
You are doing it wrong, As on click function you are giving a link directly which is not the correct syntax for on click, you need to apply the window location for it where you want to redirect, here is the code for the button to redirect, and if you want to use href then you need to use anchor tag and need to apply a css to same to make it like button
<button onclick="window.location.href='/linktoredirect'">Continue</button>
href using anchor tag
Continue
Or you can use like following
<form method="get" action="/linktoredirect">
<button type="submit">click</button>
</form>
Hope this will work for you
Just replace your onclick as follow
From :
onclick="explore.html"
to
onclick="window.location = 'explore.html'"
onclick is an event. If you want to redirect other page then use "href".
example:
link text
I'm using this code here:
<input type="button" value="Latest Results" onClick="self.location='http://URL.COM/SEARCH STRING'+document.getElementById('code').value +'EXTRA BIT OF SEARCH URL'">
Which I'm using with an input box (sometime several input boxes) to take an input and quickly add it to a URL to search an internal system. It works great for what we need, but I'm trying to get it to open in a new window rather than the current one.
I've tried adding target="_blank" to the end and changing onClick="self.location= to window.open but no luck.
Try this:
<input type="button" value="Latest Results" onClick="window.open('http://www.google.com');">
Use window.open instead of self.location :)
jsBin.
I have two html pages: /algorithrms and /algorithms/add written in scala template. The route file contains following lines:
GET /algorithms controllers.Application.algorithms()
GET /algorithms/add controllers.Application.newAlgorithmForm()
I want to add a button in the page /algorithms and when I click that button, it simply redirects to the second page /algorithms/add. I know how to do this in JavaScript. I just want to call an action from the button click and then let the action redirects me to the landing page.
So I added the following code in the first page's html template:
#form(action=routes.Application.newAlgorithmForm()){
<input type="submit" value="Add">
}
It worked, but the landing url is: http://localhost:9000/algorithms/add?
I don't want that question mark. I want to know 1) what I did wrong to cause the question mark to generate and 2) how to remove it?
I do not know if you use Twitter bootstrap, but hyperlinks can look like buttons too, and the redirect to another page sounds to me like a plain hyperlink:
<a class="btn" href="#controllers.routes.Application.newAlgorithmForm()" >
#Messages("add.newAlgorithmForm")
</a>
I have created one .html page. I have to use pagination in it so that i can avoid scrolling upto last page.and i can move to next page by click on button("Next")
You can create a form like this:
<form action="nextpage.html" method="get">
<input type="submit" value="Next" />
</form>
That will give you a form with a button that redirects the user to the page nextpage.html
Assuming you are looking for a way to implement pagination, take a look at this jquery plugin. And I believe you will find a tons more plugins across the web.
Use Jquery Pager
You can find its Demo here.
You can do that with PHP. With PHP, you can dynamcally generate HTML pages, in this case with a certain amount of items on it and links to the next and previous page.