I have a textarea in inside which the user adds some content and edits it time to time.
I want to have that text point to URL (i.e a hyperlink inside a textarea). But since itis not possible to have a hyperlink inside a textarea, is it possible to make the whole textarea link to a URL itself ?
Add onclick event handler to the textarea and set window.location with the location you want to do to.
Other option is to use a editor like CK Editor or YUI Editor
you can use jquery:
<a href='http://example.com' style='display:none' id='textarea_link'></a>
<textarea id='textarea1'></textarea>
<script type='text/javascript'>
jQuery('#textarea1').click(function(){jQuery('#textarea_link').click()});
</script>
Then when you click on the textarea it will pass the click event onto a link and your browser will treat it as if you clicked on the link.
Note: this is not using the javascript window.open function on purpose
Related
I'm working on a custom focus method for my page, which is the following:
<script type="text/javascript">
function myFunction() {
document.getElementById("name").focus();
}
</script>
The reason why I'm using this and not just autofocus is that I'm moving from one page to another. Therefore I need to click on a button on one html page and then have focus on the input tag for another page. My function is working correctly as I have been able to test it using this:
<input type="text" onmousemove=myFunction() id="focus">
However I don't want to use onmousemove, I want it to be automatic. So when the page is loaded it will then focus immediately. Is there are tag for this? If there is a possibility of using the button from HTML page 1 and get it to focus on the input box on HTML page 2, that would be good but I'm unsure how/if that is possible. Thanks.
There are multiple ways you could do this:
1: You pass query parameters in the URL of the second page using a ?:
document.getElementById("linkId").setAttribute("href","https://example.com?something");
And have javascript on the second page to check for it.
2: A better way of doing it would be to use localStorage.
localStorage.setItem("focus","true");
Code on second page:
if(localStorage.getItem("focus")==="true"){
element.focus();
}
I have a textarea/textbox which dynamically gets url from the database. Right now the textbox is showing full url address and does not look good. What I was trying to get is use some generic text like "click here for more info". I tried placeholder but does not work. I need to use generic text and when link go to the link it gets from database. Any help will be highly appreciated.
//just for test
//this text area is getting values from db(url)
<a id="aurl" target="_blank" > <textarea id="evnt"
type="text" name="event" cols="40" disabled></textarea></a>
I don't think it makes any sense to wrap a <textarea> element in an <a> anchor tag. A textarea is expecting user input, where as an anchor tag is for linking you to somewhere else. Could just use a normal hyperlink as below?
click here for more info
Im working on a function in wordpress that I wanna be able to click on a button, and when a button is clicked, the text inside the button changes and redirects the user to another page (I want to change the text inside the button from Create to Edit).
If I refresh the page or go back to the page, the text inside the button is not displaying the changed text. I want the text inside the button to always stay changed.
<a class="cc-btn">
<input id="texts" onclick="changeStyle()" value="Create"></input>
</a>
<script>
function changeStyle() {
document.getElementById("texts").value="newButtonValue";
window.location.replace("/xxxx/?page_id=xx");
}
</script>
If you would like that the changes will still remain once you refresh the page, you cannot do it using JavaScript only.
you will have to use the server side and save the new text and put it into the button value once the page is rendered. (or of course it`s possible to do something ugly like saving the data in a cookie and then use JavaScript only - but this is wrong )
Im not sure if i got your issue, but you could try it:
$(window).on('load',function(){
if(window.location.pathname == '/xxxx/?page_id=xx') {
$('#texts').val('Edit');
}
});
I built a simple CMS in Laravel 4. I've decided to switch from my old editor to this markdown editor.
My old editor used a textbox and so all I had to do was submit the form and it was passed from the view to the controller and inserted into the database etc.
However, this new editor works by turning the markdown into html and that html is inserted within a div that looks like this:
<div id="preview" class="wmd-preview"></div>
I still want to use my old form to submit the contents of the div, so my question is this:
Is there a way to insert the contents of my "preview" div into some sort of hidden input in my form?
Alternatively, is there a better way to submit the contents of my post?
get the content of your div by its id
var a = document.getElementById('preview').innerHTML;
document.getElementById('hid').value = a //create a hidden input give it an id hid
To answer your question about firing the function every time a key is pressed, I would use a jQuery event listener like .keyup().
http://api.jquery.com/keyup/
I was wondering if there is a way to protect a piece of html or text inside the jquery inline content editor jwysiwyg?
For example, I have a div that I externally insert to the editor and I do not want the user to modify it.
I could not capture the keypress event inside it (iframe security?) and setting the div to readonly or disabled did not work.
Any ideas?
Thanks!
Just add a click event handler for that div so it throws an alert and disables (graying out) the rest of the page; something like a login dialog (check out jQueryUI dialog - http://jqueryui.com/demos/dialog/)
Try it!
To clear the content in the editor use
$('#wysiwyg').wysiwyg('clear');
If you want to set the content of the editor on the fly you can use
$('#wysiwyg').wysiwyg('setContent' response.message);