We Keep Coding

Regex pattern to replace and disable href links

I need to disable a link tags (whose href attribute value starts with log.html) in my html table. I am trying to use string replace to do.
The code line looks approximately like this, str.replace(/log.html...../g,'') where there must be a regex pattern in the place of dots.
All patterns like this,
<a class="log" href="log.html#s1-s1-s1"></a>
<a class="log" href="log.html#s1-s2-s100"></a>
<a class="log" href="log.html#s10-s5-s1"></a>
must be made as,
<a class="log" href="#"></a>

You can use the following to match:
/log.html#[^"]*/g
And replace with #
Code:
str.replace(/log.html#[^"]*/g,'#')
See DEMO

What you are looking for is string.match(). This function returns an array of the match and any captured groups. You could test all your links with something like this:
$('a').each(function() {
href = $(this).attr("href");
if(href.match(/^log\.html/)) {
$(this).attr("href", "#");
}
});
Fiddle

This regex pattern seems to work given that the url is accessable as a string. This can easily be accomplished with jQuery.
str.replace(/log\.html.*/g,'#')

Since href and ".." are always available in a link, i would use a simple
/href=".+"/g
DEMO

Escape quotes in Javascript function

I'm trying to use a href onclick event in kendo grid template. When I click on the link I need the alert to diplay path text but it gives "PDF undefined error". I think it could be an issue with escape quotes.
${PDF} returns a string value.
template: "<a id='${PDF}' class='clsPDF' onclick='setpdf(\${PDF});' href='\\#'>View</a>"
<script>
function setpdf(path)
{
alert(path);
}
</script>

I would suggest slightly different approach. Instead of using inline function you can use a delegate function attached to your Grid element which will take care of all buttons like the one you defined in the template.
e.g.
$("#gridName").on("click", ".clsPDF" , function(){
var model = $("#gridName").data("kendoGrid").dataItem($(this).closest("tr"));
alert('you clicked on item with id' + model.TheIdProperty);
})
I hope this gives you the idea. I think it is cleaner this way.

When the browser looks at the link make sure it sees it like this:
<a id='someId' class='clsPDF' onclick='setpdf("pdf.pdf");' href='#'>View</a>
If it sees it like this:
<a id='someId' class='clsPDF' onclick='setpdf(pdf.pdf);' href='\\#'>View</a>
It will think pdf is a javascript object/variable and try and use it.
So you are right it is most likely a problem with quotes. You could try wrapping your \${PDF} with escaped double quotes:
\"\${PDF}\"

Check if link (not URL) contain some text (.jpg, .gif, .png)

Just to give an Idea what i'm trying to do here's an example code:
$(function(){
if ($('.maybe > div > a.link:contains(".JPG, .jpg, .gif, .GIF")').length) {
alert('hello');
});
I want to check if the content of some links are containing the dot and the letters of all image extensions, like
<div class="maybe">
<div>
<a class="link" href="someURL">thisIsAnImage.jpg</a>
<a class="link" href="someURL">thisIs**NOT**AnImage.pdf</a>
</div>
</div>
<div class="maybe">
<div>
<a class="link" href="someURL">thisIs**NOT**AnImage.zip</a>
<a class="link" href="someURL">thisIsAnotherImage.png</a>
</div>
</div>
The div's and links are generated dynamically by php, so there's no way to know how many links and div's there will be once the page is generated.
How to write the code in a properply way?
Thanks a lot for helping me to resolve the problem.

Here's my first instinct:
$('.maybe .link').each(function () {
if ($(this).text().toLowerCase().match(/\.(jpg|png|gif)/g)) {
console.log("yay I did it");
}
});
Use toLowerCase() on the link text so you don't have to check both lower and upper case. Then use String.match(regex) with a regex group to match all the file extensions.
Hope this helps!
Edit: here's an example in jsfiddle. Open your javascript console to see the output of the console.log statement. http://jsfiddle.net/9Q5yu/1/

I'd suggest:
// selects all the 'a' elements, filters that collection:
var imgLinks = $('a').filter(function(){
// keeps *only* those element with an href that ends in one of the
// file-types (this is naive, however, see notes):
return ['png','gif','jpg'].indexOf(this.href.split('.').pop()) > -1;
});
// I have no idea what you were doing, trying to do, wanting to do or why,
// but please don't use 'alert()', it's a horrible UI:
if (imgLinks.length) {
console.log('hello');
}
The above is a relatively simple, and naive, check; in that it simply splits the href on the . characters and then tests the last element from the array (returned by split()) is equal to one of the elements of the array. This will fail for any image that has a query string, for example, such as http://example.com/image2.png?postValue=1234
Given the clarification in the comments, I'd amend the above to:
var fileTypes = ['png','gif','jpg','gif'],
imgLinks = $('a').filter(function(){
return (new RegExp(fileTypes.join('|') + '$', 'gi')).test($(this).text());
});
References:
JavaScript:
Array.prototype.indexOf().)
[RegExp.prototype.test()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/test
String.prototype.split().
jQuery:
filter()

Why can I not set my data attribute with jQuery?

I have the following:
editCity: "/Admin/Citys/Edit?pk=0001I&rk=5505005Z"
$('#editCity')
.attr('title', "Edit City " + rk)
.data('disabled', 'no')
.data('href', editCity)
.removeClass('disabled');
When I check the HTML with developer tools I see this:
<div class="button dialogLink" id="editCity"
data-action="EditCity" data-disabled="yes"
data-entity="City" title="Edit City 5505005Z" ></div>
Everything is updated except the href. Anyone have an ideas what I am doing wrong?

Use
var editCity = "/Admin/Citys/Edit?pk=0001I&rk=5505005Z";
What you did was a labeled statement, consisting only of a string literal and missing a semicolon.
Btw, jQuery's .data() method is not to be used for data-attributes, but just for associating JS objects with DOM elements.

I think jQuery stores the data internally if they don't exist the first time you set them. If you really want to force it:
$("#editCity").attr("data-href",editCity)

You cannot set a href attribute to a div.
you could use data-href instead, or use a a-tag instead of a div.

Replace anchor tag onclick javascript function parameter

I have a page which has a couple of anchor tags in this format:
<a onclick="javascript:RefreshPageTo(event, "/web/Lists/exceptionlog/AllItems.aspx?Paged=TRUE&PagedPrev=TRUE&p_Created=20111026%2017%3a30%3a16&p_ID=175\u0026PageFirstRow=1\u0026\u0026View={8AB948D3-7F13-4331-9F06-29C8480B1E80}");javascript:return false;" href="javascript:">
If you look at the RefreshPageTo javascript function it has a couple of arguments. The second argument is a server relative url. It has some querystrings, I need to append some more query strings to it.
Lets say for example I want to append the following query string to it: "FilterColumn=title&FilterValue=th". Any ideas how I would do this using jquery?

Your HTML:
<a data-src="/web/Lists/exceptionlog/AllItems.aspx?Paged=TRUE&PagedPrev=TRUE&p_Created=20111026%2017%3a30%3a16&p_ID=175\u0026PageFirstRow=1\u0026\u0026View={8AB948D3-7F13-4331-9F06-29C8480B1E80}"> </a>
Note that I used 'data-src' instead of 'href' attribute.
when document loaded, run this script:
$('a').click(function(event) {
RefreshPageTo(event, $(this).attr('data-src') + '?FilterColumn=title&FilterValue=th');
/* concat what ever you want */
return false;
}