upgrading javascript that adds a link to a field - javascript

I am trying to change the Sales Stage field label to a hyperlink to pop up a new browser window.
Currently I have a form with a Sales Stage field that has a drop down::
The underlying HTML:
<td title="Select the sales process stage for the opportunity to indicate the probability of closing the opportunity." class="ms-crm-ReadField-Normal ms-crm-FieldLabel-LeftAlign" id="salesstagecode_c"><span class="ms-crm-InlineEditLabel"><span class="ms-crm-InlineEditLabelText" style="text-align: left; max-width: 115px;">Sales Stage</span><div class="ms-crm-Inline-GradientMask" style="display: none;">
</div></span></td>
or perhaps better formatted:
The function that I used previously worked on an older version of the form:
function csjs_AddHyperlinkToLabel(sFieldId, sURL, sWindowOptions) {
    var sCurrentLabel = $("label[for='" + sFieldId + "']").html();
    $("label[for='" + sFieldId + "']").html("" + sCurrentLabel + "");
}
the function above worked on a form with the following html::
What changes would be required to the javascript to change the Sales Stage field label to a hyperlink to pop up a new browser window?
Though I'd be very grateful for a solution, I'm looking for guidance on how to accomplish this. Thank you for your attention and time.
Unfortunately, the solutions below did not work. I ran this through the debugger and here's what I got http://screencast.com/t/fT6tHvXZzvc
The issue here is that we are passing “salesstagecode” to this function:
csjs_AddHyperlinkToLabel("salesstagecode", sPageURL, sWindowFeatures);
and this turns out to be NULL:
var sCurrentLabel = $("label[for='" + sFieldId + "']").html();
*
The issue is that Microsoft changed the way the forms are rendered and
the HTML of the rendered page will no longer work with the way the
function was written. The label is now in a span tag instead of a
label tag. I don't know if there is a way to identify that span and
change the contents to have new HTML to make the text link.
*
How do you update a span tag?

You need to add target="_blank" attribute in your hyperlink markup.

Simple:
change
.... onclick=\"window.open('" + sURL + "', null, '" ....
to
.... onclick=\"window.open('" + sURL + "', '_blank', '" ....

Related

Child window innerHTML displaying as text if sent via string variable

I am trying to create a web page that will enable a child window to display some additional text when a gridview row is double clicked.
I am grabbing the HTML text from a hidden column of the gridview and sending it through as follows :
Dim outputText As String = (e.Row.Cells(12).Text)
e.Row.Attributes.Add("ondblclick", "var openWindow = window.open('Child.htm','Ratting','width=550,height=170,0,status=0,');openWindow.document.getElementById('content2').innerHTML = '" + outputText + "';") 'openWindow.init();")
When the window pops up, the HTML is displayed as text - tags and all.
If I use the following and paste the same text within the code - rather than via the string, the HTML displays correctly.
e.Row.Attributes.Add("ondblclick", "var openWindow = window.open('Child.htm','Ratting','width=550,height=170,0,status=0,');openWindow.document.getElementById('content2').innerHTML = " + chr(34) + "<img src='http://www.test.com/images/image%201.jpg'/><br/><br/>Some more text"+ chr(34) + ";") 'openWindow.init();")
Could anyone point me in the right direction please? I can't figure out what's wrong and it's been driving me mad.
Thanks.
So I figured this out.
It seems when the text is posted via a variable, the tags < and > get replaced by '&lt' and '&gt'
So to fix it, I appended this after I set the innerHTML :
openWindow.document.body.innerHTML=openWindow.document.body.innerHTML.split('<').join('<').split('>').join('>');
And it's done the trick!

TinyMCE Replace Parent Node

I'm developping a WordPress plugin which adds a button to the TinyMCE editor. When that button is clicked the desired behaviour should be:
1. If the selected text is not part of a short (or is the short) then the shortcode should be inserted into the DOM.
2 If not, the shortcode should be replaced with the new one.
The first requirement is fufilled, but the second not. When inserted, it show up in the visual editor but it not saved or displayed when saving or switching to text. This leads me to believe that im not directly editting the object underneath the editor, only that which is displayed. What is the correct way to go about it. Please see the following function:
...
insertContent: function(){
var atts = '';
var node = tinyMCE.activeEditor.selection.getNode();
var edit = $(node).is('div.wp-arv-faq');
jQuery('./$p/-sc-input').each(function() {
atts = atts + jQuery(this).attr('name') + '=\"' + $(this).val() + "\" ";
});
var caption = 'F.A.Q. ' + $('./$p/-sc-input[name="tax"] option:selected').text();
var style = $('./$p/-sc-input[name="style"] option:selected').text();
atts += ' caption="' + caption + ' (' + style + ')"';
if (edit){
$(node).empty();
tinyMCE.activeEditor.selection.setContent('[arv-faq ' + atts + '][/arv-faq]');
/$p/faqMCE.closeModal();
},
...
Please note, that the '/$p/' is unique to my build process and should be ignored. Thanks in advance
From your question it is not perfectly clear what you are trying to do, but i guess you are trying to insert html code into the editor.
Be sure to have the selection set right after calling $(node).empty();
Note: All your tags and attributes need to be configured as allowed tags and attributes using valid_elements and valid_children configuration paramters.

Append "tweet this" button to blockquotes with jquery

Updated:
I'd like to append a self made "tweet this" button after blockquotes with jQuery. I figured out the following three steps are necesarry (some are already resolved thanks to the stackoverflow community):
[resolved] appending anything to the blockquote
[resolved] appending a working twitter share link to the blockquote
making sure it works with multiple blockquotes
The code I'm using at the moment is:
<script type="text/javascript">
var completeurl = window.location.protocol + "//" + window.location.host + window.location.pathname + window.location.search;
completeurl = encodeURIComponent(completeurl);
var twshare = "https://twitter.com/share?url=" + completeurl;
var bq = $( "blockquote" ).text()
$("blockquote").append("<a href='" + twshare + "&text=" + bq + "'>Click to tweet</a>");
</script>
So the current state is: I'm stuck at #3, making it work with multiple blockquotes per page. Ideally it wouldn't be necesarry to manually assign IDs or something similar. So fully automated one #tweet this" button per blockquote. Is that possible?
Thanks!
Without seeing adequate markup, it is difficult to point where the problem is.
However, it works just fine.
See this fiddle: http://jsfiddle.net/JvT7h/2/
$("blockquote").append("<a href='http://twitter.com'>Click to tweet</a>");
Aside: append doesn't add an element after, but as a child inside.
Update:
As per your comments you need to customize the anchor link to be appended to multiple blockquotes depending upon the text of each blockquote.
See this updated demo fiddle: http://jsfiddle.net/abhitalks/JvT7h/3/
JQuery:
$("blockquote").each(function(){
var $link = $("<a />"),
linkText = "Click to tweet",
url = twshare + "&text=" + $(this).text();
$link.attr("href", url);
$link.text(linkText);
$(this).append($link);
});
You need to iterate over all blockquotes and then use $(this) to append the customized anchor.

Webpage not working in IE9 (insertAdjacentHTML)

IE is giving me an error (Error: Invalid target element for this operation.) when trying to execute this code:
var d1 = document.getElementById( name + '-body');
d1.insertAdjacentHTML('beforeend', html );
Without having to put the entire function in here, the point of it is to add some text inputs dynamically when a user clicks a button. I did a bit of searching and found many statements that insertAdjacentHTML doesn't work right within tables, which is what I need it to do.
Is there a workaround for this?
Edit: Here is the html I am trying to insert. If you want I can post the generated html from Chrome also.
"<tr id=\"node-" + counter + "\">
<td>
<textarea onclick=\"Common.removeInstructions(id)\" name=\"on\" id=\"action-" + counter + "\" wrap=\"soft\" cols=\"35\" rows=\"4\" style=\"resize: none; overflow: hidden;\">
Please limit responses to 150 characters. Blank fields will be ignored.
</textarea>
</td>
<td>
<input classname=\"TextInput\" id=\"actionDate-" + counter + "\" newline=\"1\" style=\"width: 100px;\" class=\"TextInput\" assemblers=\"jaba.ui.input.TextInput\" jaba-pagerowindex=\"1\"/>
</td>
</tr>"
IE often doesn't allow you to dynamically add table rows/cells.
Pre-creating the rows/cells which you want added with display:none, then changing their innerHTML and display when needed is an useful workaround for that.
Adding Fabrício Matté as an answer so I can accept it.
If you'd show us the generated HTML and what you're trying to do, it'd be much easier to reply. Anyway, I've had a problem inserting rows/cells in a table on IE before, my solution was pre-creating the rows/cells with display:none when the table is created, then changing the 's innerHTML together with their display.

JS Alert not showing when using Sharepoint list value

I am using Sharepoint 2007 and writing a web part. In the "RenderContents" method I am writing the html code for displaying page. there is a requirement to display alert message to user when they click a link.
I have written following code-
string alertmessage = Utility.GetLocalizedText("NavigatingToNewPageTxt", "RCCResources", "Common");
writer.Write("<a href='" + clubMemberReportsLink + "' target='new' onClick='alert('" + alertmessage + "');' > ");
Note- My requirement is to get the alert message from Sharepoint list as we use SP list for translations.
when I refreshed the site link was displayed but alert message did not appear.when I checked what was rendered in browser I got following code in browser.
ClubLeaderDownloadreportsText
I tried using following code as well
writer.Write("<a href='" + clubMemberReportsLink + "' target='new' onClick=alert('" + alertmessage + "'); > ");
(I removed the single quote from onclick method.)Still the browser does not display alert message.
this behavior is observed in both browsers. I know I am missing something very simple here...
can you pleas point out any help?
Seems like you need to escape the quotation marks for so that the onclick string is not terminated. Like:
onclick='alert(\"" + alertmessage + "\");'
Hope that helps!

Categories