Reputation: 173
I have a html page which lists all the file names in a folder and common file-operations as anchor tags next to them.When a user clicks a file operation say delete,the user is prompted if he is sure he would like to delete the selected file.It works almost flawlessly but,when a file name that has spaces and special chars ex:(My Track [Ezee's].mp3) is encountered it fails.Is there a workaround to this.Any help or pointers in the right direction would be greatly appreciated.Thanks
HTML
<tr class="filetable_entry_alt">
<td>
<input type="checkbox" name="sample10 with spaces (ezee's).jpg" value="file">
</td>
<td>
<a href="/mnt/sdcard/DCIM/sample10 with spaces (ezee's).jpg" title="sample10 with spaces (ezee's).jpg" class="thumb" rel="cb">
<img src="/thumbnail.wft?image=/mnt/sdcard/DCIM/sample10 with spaces (ezee's).jpg&kind=micro&lm=1308828676000" alt="">
<b>
<img src="/thumbnail.wft?image=/mnt/sdcard/DCIM/sample10 with spaces (ezee's).jpg&kind=micro&lm=1308828676000" alt="" style="width:150px; height:150px;">
</b>
</a>
</td>
<td>
<a href="/mnt/sdcard/DCIM/sample10 with spaces (ezee's).jpg" title="sample10 with spaces (ezee's).jpg">
sample10 with spaces (ezee's).jpg
</a>
</td>
<td>
06/23/11 12:31 PM
</td>
<td>
1.76 MB
</td>
<td>
<a href="#" onclick="return confirmDel('/mnt/sdcard/DCIM/sample10 with spaces (ezee's).jpg', '/mnt/sdcard/DCIM/?');">
delete
</a> |
<a href="#" onclick="return confirmRen('/mnt/sdcard/DCIM/','sample10 with spaces (ezee's).jpg','/mnt/sdcard/DCIM/?');">
rename
</a>|
<a href="#" onclick="return confirmCopy('/mnt/sdcard/DCIM/','sample10 with spaces (ezee's).jpg', '/mnt/sdcard/DCIM/?');">
copy
</a>
</td>
JS code
var selectedFile = 'noFile';
var selectedFile2 = 'noFile';
function confirmDel(t, p) {
var confirmDeltxt = 'Are you sure you want to delete ' + t + '?';
selectedFile = decodeURIComponent(t);
selectedFile2 = decodeURIComponent(p);
jQuery.prompt(confirmDeltxt, {
callback: confirmDelcallback,
buttons: {
Delete: 'ok',
Cancel: 'cancel'
}
});
return false;
}
function confirmDelcallback(v, m, f) {
if (v != undefined && v == 'ok') {
var form = document.forms.filelist;
form.action.value = 'delete';
form.data_file.value = selectedFile2 + "/" + selectedFile;
form.submit();
}
}
function confirmRen(p, f, cp) {
selectedFile = decodeURIComponent(p);
selectedFile2 = decodeURIComponent(f);
var confirmRentxt = 'Enter new file name:<br /><br /><input type="text" id="newPath" name="newPath" value="' + f + '" />';
jQuery.prompt(confirmRentxt, {
submit: confirmRensubmit,
callback: confirmRencallback,
buttons: {
Rename: 'ok',
Cancel: 'cancel'
}
});
return false;
}
function confirmRensubmit(v, m, f) {
an = m.children('#newPath');
if (v == 'ok') {
if (f.newPath == "") {
an.css("border", "solid #ff0000 1px");
return false;
}
}
return true;
}
Upvotes: 0
Views: 211
Reputation: 767
First of all, I am not sure why are you playing with /mnt/sdcard stuff in a web page, but if your editor have a syntax highlighting feature you would immediately see that your code are a mess. here is an example:
<a href="#" onclick="return confirmDel('/mnt/sdcard/DCIM/sample10 with spaces (ezee's).jpg', '/mnt/sdcard/DCIM/?');">
delete
</a>
i am not even sure some those are a valid file path. that aside, what you need to do is to escape the characters. For example,
onclick="return confirmDel('/etc/ezze\'s.jpg');"
I am not sure about your jquery codes, but it seems quite messy as well, its better if you check it.
Upvotes: 0
Reputation: 12815
You must escape ' in lines like this when you output HTML. Resulting HTML should look like this:
onclick="return confirmCopy('/mnt/sdcard/DCIM/',
'sample10 with spaces (ezee\'s).jpg',
'/mnt/sdcard/DCIM/?');"
(new rows just for better appearance)
How you will do that depends on your server side language, but replacing ' with \' should be enough.
Upvotes: 2