I'd like to create a link that when it is clicked it will open up a some sort of dialog with some text a user can copy.
I was going to use jquery ui dialog for this but I'm wondering if there is something else I should consider?
Ideally I'd like to have that text highlighted so it is ready to copy. Don't think I can do this with jquery dialog?
Any guidance would be appreciated.
Try this :
HTML :
<div id="dialog">
<textarea id="textbox">some text to copy and paste</textarea>
</div>
JavaScript:
$('#dialog').dialog();
$('#textbox').focus().select();
This opens a dialog and then selects all of the text within the textarea. Because the focus function is used you can Ctrl+C straight off as the text is already in focus and selected.
Working demo : http://jsfiddle.net/eZbXD/
Instead of opening a dialog, you can show a textbox in which the link is selected and ready to copy. I have done something like that before. Look at this fiddle. You can remove unnecessary codes and give some style according to your need.
Related
So, I want to konw i anyone can help me
I need a html code that does this
A text that can't be changed. Something like: Put youu code here
A invisible pretext link. Something like http://trackyourcode.com/yourcode
Then a text box that the person can write the damn code
then a button tha says GO
when the person press the "go" button it will open a new tab with the pretext link + the person's code
So if the person puts "6584" as code
the link will turn ou like this
http://trackyourcode.com/yourcode6584
I want to track clicks on the following button/link with Google Tag Manager. I created a trigger in Google Tag Manager that triggers when the element_id = 100. This works fine, except that when I click exactly on the text, it doesn't do anything, the link looks like a button, with the text in the middle of it. I can't change anything to the html or css, otherwise I can think of multiple things, so I need to find a solution without changing the html. Also, the 'myclass' class and the 'label' class get used in other elements.
<a class="myclass" id="100" href="http://www.url.com">
<span class="label">Text</span>
</a>
Anyone an idea?
Thanks a lot,
The following workaround worked:
Create trigger when element text contains "Text". This will trigger events on the button and the label on the button, of all buttons with "Text" as label.
Create tag for that trigger that checks with simple javascript if either the id of the current element = 100, which will happen when you click the button but not the label, or that the id of the parent = 100, which happens when you click the label. You can get the element that triggered the tag using the built-in variable "Click Element". Which you need to access the parent element.
Technically, you shouldn't have a CSS ID that starts with (or is) a number, so not sure if your code example is accurate or not. Whatever the case, you're probably better off using "matches CSS selector" so that you don't need to use any custom JS.
If indeed your HTML uses id="100", then the above will work. If it's anything else that doesn't start with a number, then you can use
#whatever > span
I want dynamically add text-box in html page when user is press a button. and after that i want to get the respective field value or all field value.
I tried doing ng-repeat but it will not work. can anyone tell me how i will achieve this.
I would indeed use ng-repeat, and just push a new object onto the array. Maybe something like this?
<button ng-click="textFields.push("")">Add</button>
<textarea ng-repeat="val in textFields" ng-model="val"></textarea>
Well there are a few things you could try. One of them is loading a hidden div when clicked on the button. The hidden div contains the text box.
Like this :
$(document).ready(function(){
$("#hiddendiv").hide();
$("#button").click(function(){
$("#zmedia").show();
}};
And in your html form you just add a div that contains a textbox and the id of the dive should be "hiddendiv". The downside is that once the hidden div is loaded, it cant be removed. There are other scripts that are a lot more sophisticated, check these links out:
https://github.com/wam/jquery-addable
http://www.randomsnippets.com/2008/02/21/how-to-dynamically-add-form-elements-via-javascript/
I have a link which opens a table on the same page if user clicks on the link. What I want to know is that is there another way to link on the same page rather than doing this:
[Open Grid]
This is because in the url it displays # at the end of the url so I want to know is there another way to link on the same page than href="#".
Thanks
Why even use an <a> tag if you are just binding an event handler to the element. Just use a <span> and style it. You can even give it cursor:pointer if you want that link feel/look
just return false in javascript and the link will not be followed when clicked, but you can still open your tables using js, as i suspect you do right now
as I understand you alread have some function binded to the click event of this link, right? if so you can just use href="javascript:void(0)", this way is much better, because in this case browser doesn't add a context menu items such as "Open link in new tab" or "Copy link address" to this link.
If you're using Javascript to detect when an element is clicked, you don't have to use tha anchor tag, or the href attribute.
You could do <a id="showGrid">Open Grid</a> and then something like $('a#showGrid').click(...); if using jQuery. To get the "link cursor" you can do a {cursor: pointer} in CSS. It'll look the same, but you won't get that # in the browser's address bar.
I need to have a piece of text, which looks like a link but actually only calls a handler when clicked. I've first wanted to use an Anchor for that but most website say to not use an anchor if it doesn't have a href, i.e. point to a URL.
So, what's the (semantically) correct way to do this in GWT?
Use a label and style it like an anchor
<g:Label ui:field="theLabelName" />
If you want to fire a history event, use the Hyperlink widget http://google-web-toolkit.googlecode.com/svn/javadoc/1.5/com/google/gwt/user/client/ui/Hyperlink.html
If you just want to fire a random event.. not related to history, use a label like Jan mentioned.
new HTML("My Clickable Text");
Then add the click handler to the HTML