Change People Picker in NewForm.aspx Share Point IFRAME - javascript

I am new to SharePoint and need some assistance. I have a webpage written in normal HTML and JavaScript with an IFRAME that contains a SharePoint page. When the webpage loads, it contains the user's name in a hidden field. I am trying to make it so when a person clicks a button on the webpage it sets the People Picker to the text input's value from my webpage (the user's name). I tried to pull the ID of the textarea element of the SharePoint People Picker in the IFRAME and use normal j Query to set the value of the textarea of the People Picker, but it doesn't work. Any ideas? I am trying to input it on NewForm.aspx.
In the Webpage, I have a hidden input with the id 'hiddenUser' that pulls the SharePoint user's name in this format = 'Jackson, Joseph'. That works fine; although, I am not sure if that is the best way to do it. Assuming the hiddenUser input has a value, this is what I was using to try and set the People Picker:
var userPosting = $('#hiddenUser').val();
$('#newForm').contents().find('#ctl00_m_g_ffa4fb44_5605_472f_b10f_ba47d0267de5_ctl00_ctl04_ctl19_ctl00_ctl00_ctl04_ctl00_ctl00_UserField_downlevelTextBox').text(userPosting);
'newForm' is the ID of the IFRAME on my webpage. I also tried .val instead of .text and it didn't work. Any suggestions? There are multiple People Pickers on the SharePoint form.

It's possible for an embedded page in an iframe to talk to the containing parent page, but the parent page can't talk to the child unless the child explicitly allows it. JavaScript in the embedded page can refer to a parent object.
Check out this similar answer:
There is a way. When the page in the iframe loads, have it do the following
parent.childGetElementById = function (id) {return document.getElementById(id);}
parent.childLoaded();
This will make a function in the global scope of the parent page (that contains the iframe). Then in the parent, just have the following
function childLoaded() {var dom = childGetElementById('someid');}
This is along as you have control of the page your loading into the iframe... if you do not, you are out of luck.

Related

How to update or manipulate content loaded in iframe from parent?

I am trying to create some editor. What it does is I have several input fields in my current site, when user enter any word , I have seperate html rendered in iframe which is hosted separately which will have some title, subtitle and few other contents . so if user types in title input field. I want to update title in rendered html page located in iframe. please share what is the proper way to setup this scenario?
Tried to manipulate using DOM id, but its not very scalable and also laggy.
Currently checking websockets
I would assign every user an ID which is stored alongside their changes into a database. The iframe would display a php document which loads the values from the db and displays them as intended. On every change you simply reload the php with the corresponding id.
In this case, the answer is here yet: Loading a string if HTML into an iframe using JavaScript
You can do it with
document.getElementById('iframe').src =
"data:text/html;charset=utf-8," + escape(html);

Adobe DTM - Accordion link click tracking

I have a accordion link with plus symbol. When the user clicks on the plus symbol, then the accordion will expand .
Can anyone help me out how to get the text of the accordion using the Event based rule in adobe DTM.
Note: On click of Accordion symbol, the page will not load. It stays on the same page only accordion exapands.
This is done via an event-based load rule.
Depending on how your element is embedded in the code, you need to address it.
For instance, if it is a class, you need to address it via .class_name.
As you are using DTM, I assume that you are using Adobe Analytics. Therefore, you need to create an eVar to which the value of the Accordion click is passed.
Furthermore, you need to set a custom code, which tells Adobe to write this value into the eVar.
This could be an example:
var label = $(this).attr("id");
_satellite.setVar("Label",label);
return true;
This code tells Adobe to get the attribute id and pass its value into the variable label.
As the last step, you need to map the evar to %Label% that the name of the part of the Accordion is passed to AA.
Good luck :)

Bookmarklet to pass URL to form field

I want to create a bookmarklet that will allow users to submit URLS from sites on the fly as they browse.
I'm looking for three possible implementations of this bookmarklet.
Simply click the bookmarklet and be taken to the page with my form field and have the URL they just came from entered into the field.
Simply click the bookmarklet and be taken to the page with my form field and the link they had highlighted from the previous page is entered into the field.
The preferred option - Click the bookmarklet, a popup (similar to Twitter's tweet box in size and function) opens with my form field pre-populated with the URL of the page they clicked the bookmarklet on. Like Twitter's tweet box and facebook's share box.
I typically don't just give away code, but this is so simple I figure it's worth sharing and explaining.
Compressed:
javascript:(function(f,s,n,o){window.open(f+encodeURICompnent(s),n,o)}('http://example.com?url=',window.location,'yourform','width=300,height=200'));
Expanded
(function (formurl, site, name, options) {
window.open(
formurl+encodeURIComponent(site),
name,
options
);
}('http://example.com?url=', window.location, 'yourform', 'width=300,height=200'));
The way this works is it just calls an anonymous closure to pass variables to the window.open function. It passes the current page's location as the uri value in the query string.
On the page containing your form, you'll need to populate the correct field with the value from the query string.
Although this could be written without using a closure, you need to make sure that there isn't a return value from whatever's being called, as javascript:<string value> will re-write the DOM with whatever text was in <string value>.

Set value in textbox in external website when user clicks link on my website

I have my own website. There is a link on my website which redirect me to the externel website. I want to know how to set value in textbox in that externel website when user click link on my website
Have you tried to save opened window handler?
var openedWindow = window.open(....
Instead of using direct links.
Or maybe pass parameters through url?
you can add parameters on the URL.
just modify the link accordingly, and read the URL parameter on the other site.
(this assumes you don't care the possibility that someone fills the parameters with fake info)
Unless that site has implemented something to let you set that (e.g. if they populate the text field using data from the query string), you can't.
There is no standard mechanism for pre-populating forms via a link to the page containing the form.

Passing a variable to an iframe window in jQuery

Im a bit of a noob to jquery and js so ill try be as informative as I can.
I am using facebox on my page and a link which opens facebox which in turn loads an iframe inside calling a source page for the iframe window.
Loaded into the iframe then is a page which contains a form. The form validates via script thats attached to the parent window calling the iframe & facebox. The validating works but what i want to do is pass a variable back to the iframe window upon validation.
The form i refer to asks the user to create a new photo album which then appends to a select box once created as indicated here: (ill keep it brief)
var albumname = form.albumname.value;
$(""+albumname+"").appendTo('#als');
document.getElementById('albumname').value='Enter a name for a photo album';
Can anyone tell me how to pass this correctly to the iframe window?
Everything else works including the last line of code that resets the album name text input field.
Many thanks in advance,
Wayne
If you want to manipulate the contents of your iframe you can use a selector similar to this.
$("div", nameOfIframe.document)
What you need to remember is that your iframe need to be in the same domain as your main page, or else it won't work.

Categories

Resources