I am currently working in a web scrapping project with ruby on rails and below is the web-page link I am working on.
https://www.livelaw.in/top-stories/supreme-court-civil-suit-maintainable-jurisdiction-scope-sau-rajani-vs-sau-smita-2022-livelaw-sc-702-207475?infinitescroll=1
I have fetched all the (.story p ) from this page and particularly want to remove the last tag having background-color:rgb(255,255,0) Here's the thing I want to remove
I want to select the tag using the custom styling it has.
picture for clarity
I have tried everything and not able to do so. I there any other way I can select the desired text and remove it from the doc.
It is usual attribute and you can get element by such selector
element = doc.at("b[style='background-color:rgb(255,255,0)']")
And to remove it
element.remove
This looks like it works... give it a try
url = "https://www.livelaw.in/top-stories/supreme-court-civil-suit-maintainable-jurisdiction-scope-sau-rajani-vs-sau-smita-2022-liv"
elaw-sc-702-207475?infinitescroll=1")
file = Nokogiri::HTML.parse(URI.open(url))
element = file.xpath("//b[contains(#style,'background-color: rgb(255, 255, 0)')]")
Related
So, I'm trying to select a polymer custom element(using paper_elements) in my view with querySelector. I'm able to select regular html elements just fine. In particular, I'm trying to select a specific paper-input element. I want to be able to query it's input element which is buried in it's second shadowroot.
I've tried the following:
querySelector('#my-paper-input::shadow #input')
querySelector('paper-input::shadow input')
and a bunch of other variations. However, no matter what I do, the query always returns null. It's driving me mad because I can style it in css. What do?
As far as I know you have to use several steps
querySelector('#my-paper-input').shadowRoot.querySelector('input');
but you should also be able to access the value using the attribute of the outer element like
querySelector('#my-paper-input').attributes['value'] or
querySelector('#my-paper-input').attributes['inputValue']
you could also use http://pub.dartlang.org/packages/angular_node_bind
but I wasn't able using Angular with paper-elements recently (see https://github.com/angular/angular.dart/issues/1227)
With a grails app and from a local database, I'm returning some text in a xml format.
I can return it well formed in a <textarea></textarea> tag with the correct indenting (tabulation, line return,...etc.)
I want to go a bit further. In the text I'm returning, there are some <img/> tags and I'd like to replace those tag by the real images themselves.
I searched around and found no solution as of now. I understood that you can't add an image to a textarea (other then in a background), and if I choose a div tag, I won't have the indenting anymore (and therefore, harder to read)
I was wondering if using a <g:textField/> or an other tag from the grails library will do the trick. And if so, How can I append them to a page using jquery.
For example, how to append a <g:textField/> in jquery. It doesn't interpret it and I get this error
SyntaxError: missing ) after argument list [Break On This Error]...+doc).append("<input type="text" id="FTMAP_"+nb_sec+"" ...
And in my javascript file, I have
$("#FTM_"+doc).append("<g:textField id='FTMAP_"+nb_sec+"' ... />
Any possible solutions ?
EDIT
I did forget to mention that my final intentions are to be able to modify the text (tags included) and to have a nice and neat indentation so that it is the easiest possible for the end user.
You are asking a few different questions:
1. Can I use a single HTML tag to include images inside pre-formatted text.
No. You will have to parse the text and translate it into styled text yourself.
2. Is there a tag in the grails standard tags to accomplish this for me?
No.
3. How can I add grails tags from my javascript code.
Grails tags are processed on the server-side, and javascript is processed on the client. This means you cannot directly add grails tags via javascript.
There are a couple methods that can accomplish the same result, however:
You can set a javascript variable to the rendered content of a grails tag. This solution is good for data that is known at the time of the initial request.
var tagOutput = "${g.textField(/* etc */)}";
You can make an ajax request for the content to be added. Then your server-side grails code can render the tags you need. This is better for realtime data, or data that will be updated more than once on a single rendered page.
This is not a Question, just some advise I want to give to you.
After hours of googling and testing out, I didn't find a solution that worked on my lightbox. I don't know why, but I just couldn't apply a link into the title, not with htmlentities() etc.
So I came up with my own solution, which is just a workaround.
I'm not really satisfied with myself but it's the only way it works for me.
So, if you're having the same troubles like me, just add this line of code:
Search for this line of Code in lightbox.js (In my file it was the line 277):
$lightbox.find('.lb-caption').html(this.album[this.currentImageIndex].title).fadeIn('fast');
and replace it with this:
$lightbox.find('.lb-caption').html('<span onclick="window.location.href=\'http://yourdomain.com\'">'+this.album[this.currentImageIndex].title+"</span>").fadeIn('fast');
What did I do?
Since .lb-caption is added to display the title attribute, i just wrap the original output in an element and bind a click event to a certain location.
Problem with it:
Since I wrapped around the whole title attribute, the whole title attribute becomes a link.
To get the cursor: pointer; effect in css and your standard link layout, just make the title a link. In this way it doesnt has to be htmlentities() decoded link.
Example:
This link opens a new page
Another problem is: Now is the link static. (Since we're not using the href of our link).
Solution:
To add One $_GET Attribute to the link, we just need to fix a few lines.
What you do is, in your image call (the part) you add the attribute "rev", means:
Instead of This link opens a new page,
you now use (add the "rev" attribute"):
This link opens a new page
Now to the Javascript part...
Search for:
if ($link.attr('rel') === 'lightbox') {
this.album.push({
this part, and replace:
link: $link.attr('href'),
title: $link.attr('title'),
with
link: $link.attr('href'),
title: $link.attr('title'),
rev: $link.attr('rev')
If you go a few lines down you'll see the same part with link: $…., title: $…., replace that part with:
link: $(a).attr('href'),
title: $(a).attr('title'),
rev: $(a).attr('rev')
Now we just need to modify our wrapper: (Go back to now line 279, before the $_GET part it was line 277)
$lightbox.find('.lb-caption').html('<span onclick="window.location.href=\'http://yourdomain.comindex.php?page=contact&t='+this.album[this.currentImageIndex].rev+'\'">'+this.album[this.currentImageIndex].title+"</span>").fadeIn('fast');
We add now '+this.album[this.currentImageIndex].rev+' instead of the static part.
You can repeat this method to add infinite $_GET parameters, just add a new attribute to your image call, and change the javascript like we did in my explanation.
This is a really complicated and unusual way to solve the link in title problem, but its the only way how it will work in my script.
I hope that I helped someone! :)
For the Jquery UI tag-it widget, I'd like to disable text input into the class="ui-widget-content ui-autocomplete-input" textbox which contains all the tags.
My purpose is to just allow certain people the ability to delete inappropriate tags, but not allow anybody to add tags (which are auto-generated).
Is the best thing for me to edit the tag-it .js file and add a disable="disable" for that field? If I do that, won't that prevent the contents of that field from being submitted? Or does that matter as long as the associated hidden field is submitted?
Or is there a better way of doing this (an overriding style?) without modifying the tag-it file itself?
Thanks,
doug
In tag-it.js I replaced this line:
this._tagInput = $('<input type="text"').addClass('ui-widget-content');
with this:
this._tagInput = $('<input type="text" readonly="readonly"/>').addClass('ui-widget-content');
adding the readonly="readonly" attribute. That had the desired effect of preventing input but still allowing users to delete inappropriate auto-generated tags.
I had the same question as original op.
But as the question is 2 and a half years old, and tag-it version is changed.
The accepted answer needs to be updated to the folowing in
tag-it.js around line 478:
from:
if (this.options.readOnly){
tag.addClass('tagit-choice-read-only');
}
To:
if (this.options.readOnly){
tag.addClass('tagit-choice-editable');
// Button for removing the tag.
var removeTagIcon = $('<span></span>')
.addClass('ui-icon ui-icon-close');
var removeTag = $('<a><span class="text-icon">\xd7</span></a>') // \xd7 is an X
.addClass('tagit-close')
.append(removeTagIcon)
.click(function(e) {
// Removes a tag when the little 'x' is clicked.
that.removeTag(tag);
});
tag.append(removeTag);
}
This is under the documentation of git repository having the documentation, under the Properties section:
$("#myTags").data("ui-tagit").tagInput.addClass("fancy"); //Obviously
if you want to do something with class...
This translates to the solution for this below, in my personal implementation style, and probably the only way I could get this to work:
$("#myTags").data("ui-tagit").tagInput.prop('disabled' , true);
This is if I understand your question correctly.
Note: ReadOnly does not make the tags un-editable.
As far as going through the tags, you could use ..
var x = $("#myTags").tagit("assignedTags");
Make it as an input field, and that ensures its "singleFieldNode" meaning tags are , (comma) separated. That way you can parse through it (split for commas(,) into an object, or however you want to do it)
PS: To apply any of the snippets above, simply change to the "id" of the HTML element that contains TagIt, and your code would work correctly.
JQuery TagIt v2.0
I currently using ahDoctrineEasyEmbeddedRelationsPlugin to embed a Block form into a Page form.
All works well, but I'd like to hide the label of the embeddedRelation.
I've created a 'homepage-main-top' Block within the Page form in the admin, now when editting this Page, I now see 'homepage-main-top' is randomly appearing before the embedded block relation
Looking at the plugin docs, there doesn't seem to be anything relating to removing/hiding this:
http://imageshack.us/photo/my-images/197/relation.png
Does anyone know how to not display this?
Thanks
I've been struggeling with somewhat the same problem, only I needed to style the label instead of hidding / stripping it.
From what I've found out there is no simple way to manipulate the label of the embedded form, but I figured the following 'hack'.
The embedRelation method accepts a inner- and outer-decorator parameter. You can use these to wrap extra markup around the label and the embedded form. You can then use CSS to hide the label using a specific id / css class.
By openning tags in the outerdecorator and closing them in the inner decorator you can wrap the label in a tag (which is rendered inbetween the two). It is kind of tricky to make sure your HTML is still valid.
I know this is kind of a crappy solution but I haven't found a better way up until now.
Add this line to your parent form:
$this->widgetSchema['EmbeddedFormName']->setLabel(' ');
If the above doesn't work, try using the 'newFormLabel' option (from the plugin's documentation).
$this->embedRelations(array(
'RelationName' => array(
// ...
'newFormLabel' => ' ',
// ...
),
// ...
));