Avatar of Qsorb
Qsorb
Flag for United States of America asked on

Submit FORM or LINK with cfajax JavaScript

<script>
myCB = function(resp){
var msgDiv = document.getElementById('messages');
msgDiv.innerHTML = resp;
}

myError = function(sc,msg){
alert('Error!!! ' +sc +' '+msg);
}

submitFrm = function(){
	ColdFusion.Ajax.submitForm('testForm', 'update.cfm', myCB, myError);
}
</script>

<style type="text/css">
<!--
.delbtn {
	background: url("/a/delbtn-x.png") no-repeat;
	font-weight: bold; text-decoration: none; display: block;
}

.delbtn:hover {
	background: url("/a/delbtn.png") no-repeat;
	
}
-->
</style>


<!--- class delbtn displays an image which I want to keep --->


<!--- I perfer using a table and link with the message showing but cannot get the JavaScript to work with it. 
Is the problem the JavaScript name, code, what? --->
<table>
 <tr>
  <td class="delbtn" id="testForm"><div id="messages">&nbsp;</div></td>
 </tr>
</table>


<!-- I prefer NOT to use a form because I have trouble getting the DIV ID message inside the FORM Value as well as the class delbtn --->
<div class="delbtn" id="messages">&nbsp;</div>
<form name="testForm" id="testForm" action="/purchase/add-to-cart.cfm" method="post">
  <input name="messages" id="messages" class="delbtn" type="button" value=" "  onclick="javascript:submitFrm();"  />        
</form>
                                  

Open in new window


Need help finding a way to submit an anchor LINK or FORM so my JavaScript message will display correctly and at the correct place without having to resort to using css absolute positioning.

 My test code needs to go inside a table which I cannot figure out how to display the message correctly.

If I could get the form to display the info inside the VALUE, including the image of class=delbtn, as well as the JavaScript message, then I could use the form. But attempting this in every way I can imaging, does not work.

Hopefully, there's something very basically wrong I'm just not seeing.
Web ServersAJAXColdFusion LanguageJavaScript

Avatar of undefined
Last Comment
Qsorb

8/22/2022 - Mon
Coast Line

can i see a live link, this can help me sorting ur issue
Pravin Asar

Here is simple example of using cfdiv ajax binding with button click event to add a info to page.

Although this uses cfform, the page update is handled by cfdiv.



<cfform name="form1">
<br/>SELECT PRODUCT:<cfinput name="stext1" type="text" value="Product Name1" ><cfinput type="button" name="addBtn" value="Add" > 
</cfform>

<cfdiv bindonload="false"
        bind="url:AddToCart.cfm?addBtn={addBtn@click}&stext1={stext1}" ID="theDiv"
        style="background-color:##CCffFF; color:red; height:100"/>

My AddToCart.cfm is:

<cfif IsDefined("URL.stext1")>
      <cfif #len(trim(url.stext1))# eq 0>
            <cfexit>
      <cfelse>
            <cfoutput>
                  <h2>Item Added to Cart  #URL.stext1#</h2>
            </cfoutput>
      </cfif>
</cfif>
Qsorb

ASKER
myselfrandhawa: Can't show this. We're behind a firewall, text system.

pravinasar: I created two cfm pages as you suggested, using the exact code. I have no idea what to expect except that Something should happen.

 Nothing does. Are you assuming I need to change or substitute something with your code suggestion?

I don't know what to do with {addBtn@click} or {stext1}, what they mean or hint at. Don't  know if I'm suppose to remove the brackets, or substitute something. I spent a couple hours trying to figure out what you're suggesting, but without any narrative, I cannot continue.
I started with Experts Exchange in 2004 and it's been a mainstay of my professional computing life since. It helped me launch a career as a programmer / Oracle data analyst
William Peck
Qsorb

ASKER
I can't get cfdiv to work or respond with any examples I've seen then used.

I'm using cf8 standard.

I've tried many examples here and elsewhere, and there's never any response, just as though the cfdif tag is ignored. CF administrator does not even list cfdiv  as a tag in "CF Tag Permissions".

Without further suggestions here I can understand, I'll have to move back to finding a js solution and close this question.
Pravin Asar

What I am showing is cf binding capability.

And you are right, I showed an example. You need to plug in code in AddToCart.cfm

cfdiv is available in cf8. May be your hosting has disabled the cfajax functionality.
In that case, my suggestions would not work for you.
Qsorb

ASKER
> You need to plug in code in AddToCart.cfm
Yes, did that, and I'm certain the path is correct. I also used the example for the tag on http://livedocs.adobe.com, used their exact example, just as I did yours.

There is no response at all on when running the page, no matter what I do.

If you'll look at one of my earlier posts, I mention this:

"CF administrator does not even list cfdiv  as a tag in "CF Tag Permissions".

Did you miss that? We use is a fully registered CF8 standard will all important updates and fixes installed. We host our own site and our own Coldfusion 8 on our  own servers, on our own bandwidth, our own domain.


MOST IMPORTANT:
We control CF administrator. In CF Administrator, under Resource Security, CF Tags, there is no CFDIV tag listed. That tag is not present at all.  So, obviously, CFDIV is not only not available, it is not disabled. We don't have any cf tags disabled.

That fact seems important, don't you think?  Do you see CFDIV listed in this area?  And is there any other way to be certain that CFDIV is available on our CF8 standard installation? What  could be the problem? This must be a problem or confusion on my end but I don't have a clue as to what it is, makes no sense to me. What do you suggest?
⚡ FREE TRIAL OFFER
Try out a week of full access for free.
Find out why thousands trust the EE community with their toughest problems.
Pravin Asar

I have been using cfdiv since CF8. Even on Standard CF License.
ASKER CERTIFIED SOLUTION
digicidal

THIS SOLUTION ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
See Pricing Options
Start Free Trial
GET A PERSONALIZED SOLUTION
Ask your own question & get feedback from real experts
Find out why thousands trust the EE community with their toughest problems.
Coast Line

ok, so tell me what have you used messages with id everywhere and you are just displaying the respose returned also in id="messages", try this


<script>
myCB = function(resp){
var msgDiv = document.getElementById('messages');
msgDiv.innerHTML = resp;
}

myError = function(sc,msg){
alert('Error!!! ' +sc +' '+msg);
}

submitFrm = function(){
	ColdFusion.Ajax.submitForm('testForm', 'update.cfm', myCB, myError);
}
</script>

<style type="text/css">
<!--
.delbtn {
	background: url("/a/delbtn-x.png") no-repeat;
	font-weight: bold; text-decoration: none; display: block;
}

.delbtn:hover {
	background: url("/a/delbtn.png") no-repeat;
	
}
-->
</style>


<!--- class delbtn displays an image which I want to keep --->


<!--- I perfer using a table and link with the message showing but cannot get the JavaScript to work with it. 
Is the problem the JavaScript name, code, what? --->
<!-- I prefer NOT to use a form because I have trouble getting the DIV ID message inside the FORM Value as well as the class delbtn --->
<div class="delbtn" id="messages">&nbsp;</div>
<form name="testForm" id="testForm" action="/purchase/add-to-cart.cfm" method="post">
  <input name="sbtDelete" id="sbtDelete" class="delbtn" type="button" value="Delete"  onclick="javascript:submitFrm();"  />        
</form>
                                  

Open in new window

Qsorb

ASKER
Looks like using cfajaximport solved this problem with your detailed overview. Such detail and patients helps solve problems. Thanks for taking time. I'm better for it.
This is the best money I have ever spent. I cannot not tell you how many times these folks have saved my bacon. I learn so much from the contributors.
rwheeler23