Hello.

I have a DF v 3 form that I've added customjavascript for textbox proper case and telephone number editing into Module Configuration > Custom JavaScript File.  The script works fine until a Question Event fires, then the script does not work any longer.

The form AJAX is necessary to avoid the delay and frustration of a postback.  You can see the script in action at http://franchise.homehelpers.cc/HHL...fault.aspx .  Select 'Receive By Mail' in the 'Please select the way you'd like to view additional information on franchise ownership: *' field.  The event fires but the proper case script no longer works.

Advice?

Thanks.
Julie Murphy

HI Julie, have you also tried adding the exact same javascript in the field "Please select the way you'd like to view ..." in the Advanced Field Options / Client side events? Javascript under Module Configuration / Custom Javascript File is called on page load but when you perform question events, you should also place that exact javascript code on field. Try this out and see if it works out. -- David

Thanks for your quick response ... I'm a "newbie" and tried what you suggested with still the same result ...

Can you paste me what I'd enter into the client side event of a field to force title case formatting onblur on the data entered into that field?  I'm missing something.

Thanks.
Julie Murphy

I'm certain that "title case" is a common request for fields like first name, last name, street address, city, etc.  Is there a standard method or client side event code that I can use to accomplish this while taking advantage of the AJAX form feature?

Thanks.
Julie Murphy

HI Julie, can you export your form to www.betasprings.com (username: host, password: dnnhost) and send us the URL so we can take a look at your form/javascript in more detail? Thanks. -- David

David-

I did my best to set the form up exactly as we have it but, I didn't want to set-up host lists ... the URL is:
http://Beta-Springs.com/Dynamic-For...fault.aspx

Please advise.  Thanks.
Julie Murphy

HI, put the following in the Initial Javascript section (NOT Javascript File) under Module Configuration and it should work fine:
$(document).ready(function() {
$('input').filter(function (index){return $(this).attr('type') == 'text';})
.blur(function() {
this.value = (this.value).replace(/[^\s]+/g, function(word){
if(word.indexOf('@') == -1){
return word.substring(0,1).toUpperCase() + word.substring(1).toLowerCase();
}else{
return word;
}
});
})
.filter(function (index) {
return (/phone/i).test($(this).attr('id')) === true || (/phone/i).test($(this).attr('name')) === true;
})
.keyup(function(){
var v = (this.value).replace(/^\s\s*/, '').replace(/\s\s*$/, '');
v = v.replace(/[^0-9-]+/g,'');
$(this).attr('value',v)
var l = v.length;

if(!(/^[2-9]/).test(v)){$(this).attr('value','');}
else if(l>1 && !(/^[2-9]\d{1,2}/).test(v)){v = v.substring(0,l-1); $(this).attr('value',v);}
else if(l>3 && !(/^[2-9]\d{2}-/).test(v)) {v = v.substring(0,3); $(this).attr('value',v+'-');}
else if(l>4 && !(/^[2-9]\d{2}-\d{1,3}/).test(v)){v = v.substring(0,l-1); $(this).attr('value',v);}
else if(l>7 && !(/^[2-9]\d{2}-\d{3}-/).test(v)){v = v.substring(0,7); $(this).attr('value',v+'-');}
else if(l>8 && !(/^[2-9]\d{2}-\d{3}-\d{1,4}/).test(v)){v = v.substring(0,l-1); $(this).attr('value',v);}
else if(l>11 && !(/^[2-9]\d{2}-\d{3}-\d{4}$/).test(v)) { v = v.substring(0,12); $(this).attr('value',v);}
if(l==3 || l==7) {$(this).attr('value',v+'-');}

return this;
});

});
-- David

Dave-

Thank you -- that did the trick!

A follow on question ... I modified the script above to limit it to "title case" formatting (excluding the telephone number edit) as the DF edit mask is more friendly. Only problem is that when I add the title case javascript (as you suggested above and using Script Injector) it makes the DF edit mask not work ...

I know there is a conflict but I'm unsure how to resolve it ...

Thanks-Julie

HI, I don't exactly quite understand what you're trying to achieve. What type of Script Injector are you using? -- David

Hi David,

I've recently purchased DataSprings Dynamic Forms v3 as well. If I have a phone# on a form the mask and js work fine. However I also have another 3rd party Tab control that I put on the form and place my DF module inside of it. Once I do taht all JS and masking stops working. I saw your response here and tried it but could not get it to work. Would you care to ensure I'm doing it correctly? I went into mod config , expanded Custom JavaScript File, and place the JS code into Initial JavaScript.

HI Dave, very interesting. It shouldn't stop working just because it's inside a tab control. What tab control are you running (AJAX tab or DNN Aggregator or something else)? Normally, you should have a page/tabid where the DF form is located. Then you create another page/tabid with the Tab control and configure the Tab control to have the DF form page/tabid. Then the javascript should work fine as though the Tab control doesn't exist. Can you explain in more detail what Tab control you're using and how you've configure it? Thanks. -- David

Hi David,

I purchased DNN360 modules and am using CISSTab. I uploaded an image of my page and can send you a link to the page Im having trouble with. (/Portals/0/Davemcminoway/CISSTAB_DYNFORM.bmp) I just tried what you recommended - created a page with just the DF module and then anotehr page with just the tab. I then setup the tab to include the DF mod with the same result.

I also am getting error messages saying "The target element with id dnn_... does not exist" Not sure what I need to do to correct it.

David if I have the tab and DF module on different pages it gives me errors regarding the target element doesnt exist. Sorry to keep bothering you but I've tried several things and it hasn't worked yet.

Does the TAB control also configured with it's own javascript functions? If so, perhaps it's overriding the DF page? Can you check the TAB control settings? -- David

Hi David ...

Sorry for the delay in responding. My situation is likely that my custom javascript function is overriding the DF edit mask. If I delete my custom javascript, the DF edit mask works. If I add back my custom javascript, the DF edit mask does not work. Is there a setting or implementation method where I can get them both to work?

Julie

Hi David,

The developer of the module says that DF requires an initial javascript call that is being ignored by the way the tab loads it at the moment. So it doesnt look like I'm going to be able to use these modulesl together.