type=image replaces =button

[kusalo]

I have a form with a textarea.
some formatting tag inserstion buttons - [B] button loads prompt window, enter text - click OK and we have <b>my text</b> entered into the textarea.

I have this working well using
<input type=button
and can style the button
but I would very much like to use images in place of the button. Trouble is <input type=image act the same as type=submit

Any suggestions?


thanks - arfa

[Vallim]

Hi Kusalo,

Creating a html control like <input type="button" causes the form to be submitted.So to avoid the form submission, you can use

<img src=" "> and write an event handler to perform the needed action.

Regards,

Valli

www.syncfusion.com

[kusalo]

hi Valli,

thanks for the speedy reply.

> <img src=" "> and write an event handler to perform the needed action.

do you mean
<a href.... onclick=function()><img></a> ?

can you believe it?????????
I tried this a while back and it failed. I have since recoded the .js
AND - it works!

Doggone the digital doo.

PS: also surfing about I got two ideas:
use CSS to set the input with an image - yes?
use <button><img></button> - this seems less likely.

I have yet to test these but would appreciate any comments if you have the time.

many thanks - Kusalo

[kusalo]

hi,

just set up the image href
works fine but...
Inserts the formatted text - and then it disappears.


<a href onclick=\"format('<B>', '</B>', 'BOLD')\"><img src=bold.gif></a>

function format(format1, format2, format3)
{var text = prompt('Enter text to format: ' + format3);
if (text != null)
{insertAtCursor(document.REPLYFORM.sub$i, format1 + text + format2);}
else {return;}}

>
>
function insertAtCursor(myField, myValue) {
if (document.selection) // I.E.
{ myField.focus();
sel = document.selection.createRange();
sel.text = myValue;
}
//MOZILLA/NETSCAPE support
else if (myField.selectionStart || myField.selectionStart == '0')
{ var startPos = myField.selectionStart;
var endPos = myField.selectionEnd;
myField.value = myField.value.substring(0, startPos)
+ myValue
+ myField.value.substring(endPos, myField.value.length);}
else { myField.value += myValue; }} // end insert cursor

>
>
all the above works fine with...
<input type=button value=' U ' onclick=\"format('<U>', '</U>','UNDERLINE')\">

something simple is being missed and js is not that familiar to me.

Any suggestions most welcome
cheers - Kusalo

[Vallim]

Hi,

Could you use like this,

<a onclick="format('<B>', '</B>', 'BOLD')"><img src="bold.gif"></a>

In my first post i ment you to use the below syntax,u need not use the <a>tag between <img>tag.

<img src="bold.gif" onclick="format('<U>', '</U>','UNDERLINE')" />

Try the above syntax and let me know if you have any doubts.

Regards,
Valli
(www.syncfusion.com)

[Twey]

Creating a html control like <input type="button" causes the form to be submitted.Rubbish. <input type="submit"> and <input type="image"> cause the form to be submitted, although this can be worked around simply by returning false from their onclick events or the form's onsubmit event. <input type="button"> has no default action.

[kusalo]

> <input type="button"> has no default action.?

I have tested
<input type=button value=' U ' onclick=\"format('<U>', '</U>','UNDERLINE')\">
in 4 browsers and it works fine - but no image.

> The <a href approach entered the text in the textarea but it was then immediately cleared - seemed like the page was being refreshed. Does having the 'href' in make the diff? I will test this.

The current approach....
<button type=button value='space' onclick=\"format('<B>', '</B>', 'BOLD');\"><img src=../script/images/bold.gif></button>
works fine in said same browsers.

In searching for this solution there were some doubtful comments on the use of
<button>.
Any comments here?

a sunny day here in Australia.
cheers - arfa

[Twey]

<img src="../script/images/bold.gif" onclick="format('<b>', '</b>', 'BOLD');">

[kusalo]

the solution I end up using

<a href="javascript:format()">

seems obvious enough - as these things often are

Many thanks for your interest and time