I posted yesterday similar question, but today I discovered how to use data from one page at another page inside the same application. I extended Page 2 from Page 1 and now I can use all its properties (of Page 1). The problem is that when some property value has changed inside Page 1 (new value) I still get the old value in page 2. How can I reflect the change at Page 1 to the Page 2?
For two way data binding from parent to child element and vv.; use attribute-name = "{{property}}" (not [[property]]) and declare proterty at child as notify:true to reflect property upway data binding.
Related
I am new to Blue Prism and Web scraping. I want to scrape a list of items under a header. The header won't change, but the items in the list will.
Example:
Member Listing
Charles Schwab
TD Ameritrade
List changes
Member Listing
Well Fargo
TD Ameritrade
So how do I ensure the attributes in the Application Modeller for the list will always be able to scrape the changing items in the list?
I note some attributes like
tag name = UI
path=/HTML/BODY(1)/SGX-HEADER(1)/HTML/BODY(1)/DIV(1)/MAIN(1)/DIV(1)/ARTICLE(1)/TEMPLATE-BASE(1)/DIV(1)/DIV(1)/SECTION(1)/DIV(1)/SGX-WIDGETS-WRAPPER(1)/WIDGET-RICH-TEXT(5)/UL(1)
What do these attributes mean? Thank you
You can create the attribute to be dynamic and verify it exists before reading it from the application. Once your app modeller is set up it will look something like
path=/HTML/BODY(1)/SGX-HEADER(1)/HTML/BODY(1)/DIV(1)/MAIN(1)/DIV(1)/ARTICLE(1)/TEMPLATE-BASE(1)/DIV(1)/DIV(1)/SECTION(1)/DIV(1)/SGX-WIDGETS-WRAPPER(1)/WIDGET-RICH-TEXT(5)/UL(1)
with this field being set to dynamic. At run time you have a flow that looks like the below:
this is what the flow would look like, check it exists then make space in a collection and read the value at the element path that exists. the wait stage looks like this:
so the flow Is straight forward enough, dynamic variable to track the element existing, once it exists confirmed by wait stage then read the contents at that path value and repeat until there are no more elements that exist and output the collection as a result.
I'm having an issue where the team that developed a web based application used a WYSIWYG editor and, a couple months ago, they updated some of the HTML form labels and IDs. My team creates macros that work with the DOM to gather/enter/update information in these web based applications. When I got a report about the update, I looked into it and found that the original code for a specific line was:
strQ = objIE.document.getElementById("ctl00_ContentPlaceHolder1_lblQueue").innerTEXT
Whatever is in the label for this element ID would be stored in strQ and used to detect the work queue the user is working from in another web based application. When the team for the first application made the update, the code for the label's element ID became:
strQ = objIE.document.getElementById("ContentPlaceHolder1_lblQueue").innerTEXT
As you can see, they removed the ctl00_ from the beginning of the label' element ID. Just a few days ago, then made another update and it was added back. Since all the label IDs begin with ContentPlaceHolder1_ and can sometimes contain ctl00_, is there any way of using RegExp to simply find lblQueue in the label's ID?
You can use the querySelector as described here: https://stackoverflow.com/a/24296220/4181058
In your example it would be (id$ means where the ID 'ends with'):
document.querySelector('[id$="lblQueue"]').innerText
Example: We have an employee list page, that consists of filter criteria form and employee list grid. One of the criteria you can filter by is manager. If the user wants to pick a manager to filter by, he uses the lookup control and popup window is opened, that also has filter criteria and employee list grid.
Now the problem is, that if the popup window is not an iframe, some of the popup elements will have same names and ids as the owner page. Duplicate ids cause Kendo UI to break as by default MVC wrapper generates script tags with $("#id").kendoThingie.
I have used iframe in the past, but content that does not fit in iframe window like long dropdown lists gets cut off and now IE11 especially causes various issues like https://connect.microsoft.com/IE/feedback/details/802251/script70-permission-denied-error-when-trying-to-access-old-document-from-reloaded-iframe.
What would be the best solution here? Generate unique ids for all elements on Razor pages? Modify partial page content that is retrieved by Ajax making ids unique? Something else?
It sounds like you are using a partial page as the content to a Kendo window. If this is the case then just provide your partial with a prefix like so at the top of the page.
#{
ViewData.TemplateInfo.HtmlFieldPrefix = "MyPrefix"
}
Now when you create a kendo control via the MVC wrapper like so
#(Html.Kendo().DropDownListFor(o => o.SomeProperty)
.....
)
The name attribute will be generated as "MyPrefix.SomeProperty" and the id attribute will be generated as "MyPrefix_SomeProperty". When accessing it within Jquery I like a shorter variable name so I usually do
string Prefix = ViewData.TemplateInfo.HtmlFieldPrefix
After setting the prefix. Then use
var val = $('##(Prefix)_SomeProperty').data('kendoDropDownList').value();
Note after this change. If you are posting a form from that partial you will need to add the following attribute to your model parameter on the controller method like so. So that binding happens correctly.
[HttpPost]
public ActionResult MyPartialModal([Bind(Prefix = "MyPrefix")] ModeViewModel model) {
.....
}
Now with all of that said. As long as you keep your prefixes different for each partial your control ids and names will be unique. To ensure this I usually make my prefix name be the same as my cshtml page that I am creating. You would just need to worry about JS function names. Also, note when closing a kendo window all DOM still exist. You just hide it. If this causes you the same issue you just need to be sure to clear the DOM of the modal on close. Similar to how BurnsBA mentioned. Note because of this is the reason why I try to make sure I use the least amount of kendo windows as possible and just reuse them via the refresh function pointing to a different URL.
$('#my-window').data('kendoWindow').refresh({
url: someUrlString
, data: {
someId: '#Model.MyId'
}
}).open().center();
Then on the modal page itself. When posting I do the following assuming nothing complicated needs to happen when posting.
var form = $('#my-form'); //Probably want this to be unique. What I do is provide a GUID on the view model
$('#my-window').data('kendoWindow').refresh({
url: form.attr('action')
, data: form.serialize()
, type: 'POST'
}).open().center();
We do something similar, and have the same problem. We have create/edit/delete popups that fetch data via ajax. Different viewmodels might reference the same model on the same page, and if you open multiple popups (create item type 1, create item type 2) then the second and subsequent popups can be broken (kendo ui error such that a dropdown is now just a plain textbox). Our solution is to delete all dom entries when the popup is closed so there are no conflicts between ids in different popups. We use bootstrap, so it looks like
<script type="text/javascript">
$('body').on(
// hook close even on bootstrap popup
'hidden.bs.modal', '.modal',
function () {
$(this).removeData('bs.modal');
$(this).find('.modal-content').html(''); // clear dom in popup
});
</script>
Note that our popup has some outer html elements and identifiers, but the content is all in
<div class="modal-content"> ... </div>
I have a basic ASP.Net MVC 3 application which has a number of controllers and a number of actions (and subsequently views)
A common feature of the application is to show a pop-up dialog window for basic user input. One of the key features of this dialog process is a faded mask that gets shown behind the dialog box.
Each of these dialog window controls is in a separate Partial View page.
Now, some view pages may use multiple dialog boxes, and therefore include multiple partial views in them - which as is would mean multiple instances of the "mask" element.
What I am trying to find a solution for is to only need to create one instance of a "mask" element regardless of the number of dialog partial views I include, and then the script in each partial dialog will have access to this element (so basically it just needs to be on the page somewhere)
The only real idea I have come up with so far is to add the "mask" element to the master page (or in the original view page) and this will mean it only gets added once. The problem here is that it will be added even when it is not needed (albeit one small single element)
I can live with this, but I would like to know if there is a better way to handle these kinds of scenarios?
A quick idea that came to mind is some kind of master page inheritance hierarchy, So I may have a DialogMasterPage that inherits from the standard current master page. How does that sound for an approach?
Thanks
To do something like this, where each module can register their need for a certain thing in the master page, you can use HttpContext to store a flag of whether you need to write the mask div, and just set that property in each partial. At the end of the master page, if the flag is set, you can then write the mask div if its set to true.
Obviously to make this cleaner you could wrap it all in an HtmlHelper extension or something.
My initial thought is for you to use something like jQuery UI where it handles the masking for you or if you are using something custom you can load the content for the dialog via ajax then show it in the single dialog on the master page.
I'm trying to figure out how to bind a javascript event to a select element in GWT, however the select element isn't being built in GWT, but comes from HTML that I'm scraping from another site (a report site from a different department). First, a bit more detail:
I'm using GWT and on load, I make an ajax call to get some HTML which includes, among other things, a report that I want to put on my page. I'm able to get the HTML and parse out the div that I'm interested in. That's easy to display on my page.
Here's where I get stuck: On the portion of the page I'm using, there's a select element which I can easily locate (it has an id), but would like to capture event if my user changes that value (I want to capture changes to the select box so I can make another ajax call to replace the report, binding to the select on that page, and starting the whole process again).
So, I'm not sure how, once I get the HTML from a remote site, how to bind an event handler to an input on that fragment, and then insert the fragment into my target div. Any advice or pointers would be greatly appreciated!
How about this:
Element domSelect = DOM.getElementById("selectId");
ListBox listBox = ListBox.wrap(domSelect);
listBox.addChangeHandler(new ChangeHandler() {
void onChange(ChangeEvent event) {
// Some stuff, like checking the selected element
// via listBox.getSelectedIndex(), etc.
}
});
You should get the general idea - wrap the <select> element in a ListBox. From there, it's just a matter of adding a ChangeHandler via the addChangeHandler method.