I am writing a small desktop app in PYQT python which has a QWeb View browser. I am adding a functionality to this browser that when user select any text using mouse and right click and press show xpath a javascript is executed to find the xpath.
Here is my code :
#pyqtSlot()
def slotshowxpath(self):
text = self.selectedText()
if not text:
QMessageBox.information(self,"information","No Text Selected")
else:
frame = self.page().mainFrame().documentElement()
#print frame.toHtml()
#abc = frame.document()
#abc.evaluateJavaScript("alert('"+self.page().selectedHtml()+"');")
frame.evaluateJavaScript("""var data = window.getSelection().anchorNode.parentNode; getXPath(data);
function getXPath( element ){
alert(element);
var xpath = '';
for ( ; (element && element.nodeType) == 1; element = element.parentNode )
{
var id = $(element.parentNode).children(element.tagName).index(element) + 1;
id > 1 ? (id = '[' + id + ']') : (id = '');
xpath = '/' + element.tagName.toLowerCase() + id + xpath;
}
alert(xpath);
return xpath;
}"""
)
this query is working good till $(element.parentNode).children but not working for $(element.parentNode).children(element.tagName).index(element) + 1, can anybody help me in fixing this issue?
actually the problem was with the alert statement inside the query.its not getting executed inside but when i tried it outside the javascript after returning the value, it start working
Related
I am trying to replace some text inside a div using a modal window with a form input but for some reason I can't get it to work on IE11. I've realized that it skips new lines when selecting a piece of text containing a <br>
Here is a working example:
http://jsfiddle.net/8VdE9/3/
The funny thing is that I am using the same code in a different page and it gets the new lines fine, which makes me think that I am missing something.
var isIE11 = !!navigator.userAgent.match(/Trident.*rv\:11\./);
range = window.getSelection().getRangeAt(0);
if(!isIE11){
text = new XMLSerializer().serializeToString(range.cloneContents());
}
else{
text = range;
}
text = new String(text);
var textBr = nl2br(text.toString());
function nl2br (str, is_xhtml) {
var breakTag = (is_xhtml || typeof is_xhtml === 'undefined') ? '<br />' : '<br>';
return (str + '').replace(/([^>\r\n]?)(\r\n|\n\r|\r|\n)/g, '$1' + breakTag + '$2');
}
Any help would be very appreciated.
Regards
I have this site HERE and what it dose is tell you the size of your screen and the size of your window.
When you adjust your window size the numbers change and is then displayed on the page.
What I want to happen is when you do this, the title also displays the figure.
Similar to this HERE. As you change the number so does the title.
I am not sure how to do this?
Any help would be much appreciated :)
Thank you
Here is the code which changes the title, taken from the site which you provided :)
function invChange() {
changeField = invField;
var num = rate ? parseFloat(invField.inner.value) : null;
var prod = num ? round(rate * num, 4) : '';
with(numField) {
val(prod);
gauge();
if (prod) {
pulse();
doc.title = prod + ' ' + cur + ' · Preev'
}
}
}
function numChange() {
changeField = numField;
var num = rate ? parseFloat(numField.inner.value) : null;
var prod = num ? round(num / rate, 4) : '';
with(invField) {
val(prod);
gauge();
if (rate) {
pulse();
doc.title = prod + ' BTC · Preev'
}
}
}
Here doc is variable which holds document (var doc = document).
If you want to have look at the complete javascript file then check this fiddle
You just have to look at the source to see how it's done:
document.title = 'whatever'
You need to update this value using the DOM.
In JavaScript you can get the value of this by doing the following
document.title="some text";
In JQuery
$('title').text('some text');
document.title = 'whatever';
document.getElementsByTagName('title')[0].text = 'whatever';
document.getElementsByTagName('title')[0].innerHTML = 'whatever';
$('title').text('whatever'); //jQuery
I have created a html like this:
<body onload = callAlert();loaded()>
<ul id="thelist">
<div id = "lst"></div>
</ul>
</div>
</body>
The callAlert() is here:
function callAlert()
{
listRows = prompt("how many list row you want??");
var listText = "List Number";
for(var i = 0;i < listRows; i++)
{
if(i%2==0)
{
listText = listText +i+'<p style="background-color:#EEEEEE" id = "listNum' + i + '" onclick = itemclicked(id)>';
}
else
{
listText = listText + i+ '<p id = "listNum' + i + '" onclick = itemclicked(id)>';
}
listText = listText + i;
//document.getElementById("lst").innerHTML = listText+i+'5';
}
document.getElementById("lst").innerHTML = listText+i;
}
Inside callAlert(), I have created id runtime inside the <p> tag and at last of for loop, I have set the paragraph like this. document.getElementById("lst").innerHTML = listText+i;
Now I am confuse when listItem is clicked then how to access the value of the selected item.
I am using this:
function itemclicked(id)
{
alert("clicked at :"+id);
var pElement = document.getElementById(id).value;
alert("value of this is: "+pElement);
}
But getting value as undefined.
Any help would be grateful.
try onclick = itemclicked(this.id) instead of onclick = 'itemclicked(id)'
Dude, you should really work on you CodingStyle. Also, write simple, clean code.
First, the html-code should simply look like this:
<body onload="callAlert();loaded();">
<ul id="thelist"></ul>
</body>
No div or anything like this. ul and ol shall be used in combination with li only.
Also, you should always close the html-tags in the right order. Otherwise, like in your examle, you have different nubers of opening and closing-tags. (the closing div in the 5th line of your html-example doesn't refer to a opening div-tag)...
And here comes the fixed code:
<script type="text/javascript">
function callAlert() {
var rows = prompt('Please type in the number of required rows');
var listCode = '';
for (var i = 0; i < rows; i++) {
var listID = 'list_' + i.toString();
if (i % 2 === 0) {
listCode += '<li style="background-color:#EEEEEE" id="' + listID + '" onclick="itemClicked(this.id);">listItem# ' + i + '</li>';
}
else {
listCode += '<li id="' + listID + '" onclick="itemClicked(this.id);">listItem# ' + i + '</li>';
}
}
document.getElementById('thelist').innerHTML = listCode;
}
function itemClicked(id) {
var pElement = document.getElementById(id).innerHTML;
alert("Clicked: " + id + '\nValue: ' + pElement);
}
</script>
You can watch a working sample in this fiddle.
The problems were:
You have to commit the id of the clicked item using this.id like #Varada already mentioned.
Before that, you have to build a working id, parsing numbers to strings using .toString()
You really did write kind of messy code. What was supposed to result wasn't a list, it was various div-containers wrapped inside a ul-tag. Oh my.
BTW: Never ever check if sth. is 0 using the ==-operator. Better always use the ===-operator. Read about the problem here
BTW++: I don't know what value you wanted to read in your itemClicked()-function. I didn't test if it would read the innerHTML but generally, you can only read information from where information was written to before. In this sample, value should be empty i guess..
Hope i didn't forget about anything. The Code works right now as you can see. If you've got any further questions, just ask.
Cheers!
You can pass only the var i and search the id after like this:
Your p constructor dymanic with passing only i
<p id = "listNum' + i + '" onclick = itemclicked(' + i + ')>
function
function itemclicked(id)
{
id='listNum'+i;
alert("clicked at :"+id);
var pElement = document.getElementById(id).value;
alert("value of this is: "+pElement);
}
is what you want?
I am not sure but shouldn't the onclick function be wrapped with double quotes like so:
You have this
onclick = itemclicked(id)>'
And it should be this
onclick = "itemclicked(id)">'
You have to modify your itemclicked function to retrieve the "value" of your p element.
function itemclicked( id ) {
alert( "clicked at :" + id );
var el = document.getElementById( id );
// depending on the browser one of these will work
var pElement = el.contentText || el.innerText;
alert( "value of this is: " + pElement );
}
demo here
feel like im coming here way too often to ask questions but yet again I am stuck. I am attempting to select a textarea and allow myself to edit the text in another textarea, which works fine using textboxs but not with textareas. Every time I click on the div container I am getting an undefined result when looking for the textarea. Below is the code.
jQuery
$(".textAreaContainer").live('click','div', function(){
var divID = this.id;
if ( divID !== "" ){
var lastChar = divID.substr(divID.length - 1);
var t = $('#' + divID ).find(':input');
alert(t.attr('id'));
t = t.clone(false);
t.attr('data-related-field-id', t.attr('id'));
t.attr('id', t.attr('id') + '_Add');
t.attr('data-add-field', 'true');
var text = document.getElementById(divID).innerHTML;
//var textboxId = $('div.textAreaContainer').find('input[type="textArea"]')[lastChar].id;
$('div#placeholder input[type="button"]').hide();
var text = "<p>Please fill out what " + t.attr('id') +" Textarea shall contain</p>";
if ( $('#' + t.attr('id')).length == 0 ) {
$('div#placeholder').html(t);
$('div#placeholder').prepend(text);
}
}
else{
}
});
t.attr('id') should be returning textbox1(or similar) but instead just returns undefined.
I have tried .find(':textarea'),.find('textarea'),.find(text,textArea),.find(':input') and quite a few others that I have found through google but all of them return undefined and I have no idea why. A demo can be found here, http://jsfiddle.net/xYwaw/. Thanks in advance for any help guys, it is appreciated.
EDIT: Below is the code for a very similar example I am using. This does what I want to do but with textboxs instead of textareas.
$('#textAdd').live('click',function() {
var newdiv = document.createElement('div');
newdiv.innerHTML = "Textbox " + textBoxCounter + " <br><div id='container" + counter + "' class='container'><li><input type='text' id='textBox" + textBoxCounter +"' name='textBox" + textBoxCounter + "'></li></div></br>";
document.getElementById("identifier").appendChild(newdiv);
textBoxCounter++
counter++;
});
$(".container").live('click','div', function(){
var divID = this.id;
if ( divID !== "" ){
var lastChar = divID.substr(divID.length - 1);
var t = $('#' + divID).find('input');
alert(divID);
t = t.clone(false);
t.attr('data-related-field-id', t.attr('id'));
alert(t.attr('id'));
t.attr('id', t.attr('id') + '_Add');
t.attr('data-add-field', 'true');
var text = document.getElementById(divID).innerHTML;
// var textboxId = $('div.container').find('input[type="text"]')[lastChar].id;
$('div#placeholder input[type="button"]').hide();
var text = "<p>Please fill out what " + t.attr('id') +" textbox shall contain</p>";
if ( $('#' + t.attr('id')).length == 0 ) {
$('div#placeholder').html(t);
$('div#placeholder').prepend(text);
}
}
else{
}
});
First up remove the second parameter, 'div', from the first line:
$(".textAreaContainer").live('click','div', function(){
...to make it:
$(".textAreaContainer").live('click', function(){
Then change:
var t = $('#' + divID ).find(':input');
...to:
var t = $(this).find(':input');
Because you already know that this is the container so there's no need to select it again by id. Also the id attributes that you're assigning to your textarea containers have a space in them, which is invalid and results in your original code trying to select the element with '#textAreaContainer 0' which actually looks for a 0 tag that is a descendant of #textAreaContainer. So fixing the code that creates the elements to remove that space in the id is both a good idea in general and an alternative way of fixing this problem.
I have the following javascript that is being called in the OnClientReordered event. I am trying to change the text of the items in the list when they are reordered. What I am seeing is the item does not update the first time the event fires. The second time the event fires the text gets rendered correctly. (The text is being changed properly, as I can put a watch on the values, and the text is correct. It is just not being rendered) Is there something I am doing incorrectly here? I could find no information from the documentation on the API.
function SetcontentorderNumber() {
reg = new RegExp("\\[\\d*\\]")
var list = $find("<%= foo.ClientID %>");
var length = list.get_items().get_count();
list.trackChanges();
for (var i = 0; i < length; i++) {
var text = list.getItem(i).get_text();
if (reg.test(text)) {
texttext = text.replace(reg, "[" + (i + 1) + "] ");
list.getItem(i).set_text(text);
}
else {
text = "[" + (i + 1) + "] " + text;
list.getItem(i).set_text(text);
}
}
list.commitChanges();
}
This was an issue with the version we were using Q3 2009 of the ajax controls. I tried this out on a project using the newest version of the controls and it worked fine.