2,803,210
Total Marketplace Items3,713,675
COPYRIGHT © 2013 ENVATO| TERMS OF USAGE| SUPPORT/HELP| ICONS BY TANGO + WEFUNCTION + FAMFAMFAM
Adobe®, Flash®, Flex®, Fireworks®, Photoshop®, Illustrator®, InDesign® and After Effects® are registered trademarks of Adobe Systems Incorporated.
Hello there, There is a way to add an horizontal menu with submenus?
Example: http://cssmenumaker.com/menu/grey-impression-drop-down-menu-0
But stylized like your theme…
Hello.
Sorry, i don’t have any plans to add such menus. You can do it yourself, that should be pretty easy with existing styles
This is not only a theme or template.. With all the included plugins and detailed documentation this is absolutely amazing and definitely worth the money! Outstanding, five stars!
Thank you for kind words!
Hi bought this about a week ago and its really easy to work with—Very Nice!. I’m not too familiar with javascript and the only thing I can’t figure out is how to limit Maximum Characters or limit the number of keywords on the tagsinput js. Is this something you could add? either would be great.
Hi.
Full set of plugin settings:
$(selector).tagsInput({ 'autocomplete_url': url_to_autocomplete_api, 'autocomplete': { option: value, option: value}, 'height':'100px', 'width':'300px', 'interactive':true, 'defaultText':'add a tag', 'onAddTag':callback_function, 'onRemoveTag':callback_function, 'onChange' : callback_function, 'removeWithBackspace' : true, 'minChars' : 0, 'maxChars' : 0 //if not provided there is no limit, 'placeholderColor' : '#666666' });More info and complete documentation you can find here
Hello! Thanks for the answer above, I resolved the issue. I wonder also if there is some js in the design or method to prevent double click on form submissions, avoiding duplication of transmission?
You can try to add Disabled attr to the button after the first click:
// assuming you're talking submit buttons $("form :input:submit").click(function() { this.disabled = 'disabled'; // or $(this).attr("disabled", true); });Hi Kopyov,
I got problem with form to submit via ajax (serialize).
Example :
<script type=”text/javascript” > $(function() { $(”.submit”).click(function() { var name = $(”#name”).val(); var username = $(”#username”).val(); var password = $(”#password”).val(); var gender = $(”#gender”).val(); var dataString = ‘name=’+ name + ‘&username=’ + username + ‘&password=’ + password + ‘&gender=’ + gender;
if(name==’’ || username==’’ || password==’’ || gender==’‘) { $(’.success’).fadeOut(200).hide(); $(’.error’).fadeOut(200).show(); }else{ $.ajax({ type: “POST”, url: “dsp_cfindexcharting.cfm”, data:$(’#form’).serialize(), success: function(response){ $(’.msg’).html(response); $(’.success’).fadeIn(200).show(); $(’.error’).fadeOut(200).hide();} }); }
return false; }); }); </script>
<form id=”form” method=”post” name=”form”>- <input id=”name” name=”name” type=”text” />
- <input id=”username” name=”username” type=”text” />
- <input id=”password” name=”password” type=”password” />
- <select id=”gender” name=”gender”>
<option value=””>Gender</option>
<option value=”1”>Male</option>
<option value=”2”>Female</option>
</select>
<input type=”submit” value=”Submit” id=”submit” class=”submit”/> Please Enter Valid Data Registration Successfully </form>When i click submit… it suppose to serialize the submission without refreshing the whole page. Unfortunately, when i use this theme. Its refresh everything.
Is there any workaround for my problem.
Regards,
Bakri
Try to submit a form with $.ajaxSubmit
or try to play with event.preventDefault(); for default event
Hi Kopyov,
Thanx a lot. Its work. now..i got another series of problem. with the jquery .load(), once the page loaded into the container. all your features doesn’t work. for example. i load external page from my main page. That external page contain a dynamic table. the table is loaded, but all the features like search / sort and paging all doesn’t work. how to make it works. Pls help.
Regards,
Bakri
could you please show me your page, i’ll check what’s wrong?
Thanks
Pls navigate here ==> http://civet.viviotech.net/project_dark/index.cfm
Click on “Fund Analysis” will load another page which load from other HTML .
Seems like plugin doesn’t work at all. Does your table work correctly on that page you load?
hi kopyov,
now its working. my mistake. accidently deleted script jquery file on content page.
Thanks for support & speedy reply.
Regards,
Bakri.
Hi Kopyov,
I got another issue with jquery + table plugin. Pls look here > http://civet.viviotech.net/project_dark/index2.cfm If u click “Fund Analysis” the div will load table from file > http://civet.viviotech.net/project_dark/dsp_content.cfm
The issue is. I can independently access http://civet.viviotech.net/project_dark/dsp_content.cfm. But when its load from index2.cfm its so damn slow + give this error message “Cannot reinitialise DataTable. To retrieve the DataTables object for this table, please pass either no arguments to the dataTable() function, or set bRetrieve to true. Alternatively, to destory the old table and create a new one, set bDestroy to true (note that a lot of changes to the configuration can be made through the API which is usually much faster).”
Can you help me to solve this issue.
Regards,
Bakri
your page shows an error that 2 files are missed – mousewheel and spinner, that’s why the rest of jquery plugins could be broken
Hi Kopyov, Pls look here > http://civet.viviotech.net/project_dark/index2.cfm All js file included. No broken plugin. The table file is here > http://civet.viviotech.net/project_dark/dsp_content.cfm
The problem is, if i go straight to http://civet.viviotech.net/project_dark/dsp_content.cfm. No issue. Speed is fast.
But when i load “http://civet.viviotech.net/project_dark/dsp_content.cfm” from http://civet.viviotech.net/project_dark/index2.cfm [click on “Fund Analysis”]. That will takes long time to load. It also give this error “Cannot reinitialise DataTable. To retrieve the DataTables object for this table, please pass either no arguments to the dataTable() function, or set bRetrieve to true. Alternatively, to destory the old table and create a new one, set bDestroy to true (note that a lot of changes to the configuration can be made through the API which is usually much faster).”
I see. Honestly i have no idea why it works so slow, because i don’t know your code, your datatables settings and your general concept. As i understood you load table via ajax by pressing Fund analysis? If yes, try to load table in a simple iframe and check if it works fine there. What settings for datatable are you using?
hi kopyov,
You are rite, my concept is to load the table content which from other file into div using ajax. Not sure wether this is the correct way to do it.
If can give me advise on how to materialise it. Im just using your sample form the source file as for now. no fancy setting. Hope u can help.
This is my content code ==>
<!DOCTYPE html PUBLIC ”-//W3C//DTD XHTML 1 .0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> <html xmlns=”http://www.w3.org/1999/xhtml”> <head> <meta http-equiv=”Content-Type” content=”text/html; charset=utf-8” /> <title>Untitled Document</title> </head> <link href=”css/main.css” rel=”stylesheet” type=”text/css” /> <script type=”text/javascript” src=”jquery/1.7/jquery.min.js”></script> <script type=”text/javascript” src=”js/plugins/spinner/jquery.mousewheel.js”></script> <script type=”text/javascript” src=”js/plugins/spinner/ui.spinner.js”></script>
<!
—<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js”></script> --> <script type=”text/javascript” src=”jqueryui/1.8/jquery-ui.min.js”></script> <script type=”text/javascript” src=”js/plugins/wysiwyg/jquery.wysiwyg.js”></script> <script type=”text/javascript” src=”js/plugins/wysiwyg/wysiwyg.image.js”></script> <script type=”text/javascript” src=”js/plugins/wysiwyg/wysiwyg.link.js”></script> <script type=”text/javascript” src=”js/plugins/wysiwyg/wysiwyg.table.js”></script> <script type=”text/javascript” src=”js/plugins/flot/jquery.flot.js”></script> <script type=”text/javascript” src=”js/plugins/flot/jquery.flot.orderBars.js”></script> <script type=”text/javascript” src=”js/plugins/flot/jquery.flot.pie.js”></script> <script type=”text/javascript” src=”js/plugins/flot/excanvas.min.js”></script> <script type=”text/javascript” src=”js/plugins/flot/jquery.flot.resize.js”></script> <script type=”text/javascript” src=”js/plugins/tables/jquery.dataTables.js”></script> <script type=”text/javascript” src=”js/plugins/tables/colResizable.min.js”></script> <script type=”text/javascript” src=”js/plugins/forms/forms.js”></script> <script type=”text/javascript” src=”js/plugins/forms/autogrowtextarea.js”></script> <script type=”text/javascript” src=”js/plugins/forms/autotab.js”></script> <script type=”text/javascript” src=”js/plugins/forms/jquery.validationEngine-en.js”></script> <script type=”text/javascript” src=”js/plugins/forms/jquery.validationEngine.js”></script> <script type=”text/javascript” src=”js/plugins/forms/jquery.dualListBox.js”></script> <script type=”text/javascript” src=”js/plugins/forms/chosen.jquery.min.js”></script> <script type=”text/javascript” src=”js/plugins/forms/jquery.maskedinput.min.js”></script> <script type=”text/javascript” src=”js/plugins/forms/jquery.inputlimiter.min.js”></script> <script type=”text/javascript” src=”js/plugins/forms/jquery.tagsinput.min.js”></script> <script type=”text/javascript” src=”js/plugins/other/calendar.min.js”></script> <script type=”text/javascript” src=”js/plugins/other/elfinder.min.js”></script> <script type=”text/javascript” src=”js/plugins/uploader/plupload.js”></script> <script type=”text/javascript” src=”js/plugins/uploader/plupload.html5.js”></script> <script type=”text/javascript” src=”js/plugins/uploader/plupload.html4.js”></script> <script type=”text/javascript” src=”js/plugins/uploader/jquery.plupload.queue.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.progress.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.jgrowl.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.tipsy.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.alerts.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.colorpicker.js”></script> <script type=”text/javascript” src=”js/plugins/wizards/jquery.form.wizard.js”></script> <script type=”text/javascript” src=”js/plugins/wizards/jquery.validate.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.breadcrumbs.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.collapsible.min.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.ToTop.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.listnav.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.sourcerer.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.timeentry.min.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.prettyPhoto.js”></script> <script type=”text/javascript” src=”js/custom.js”></script><!
- Dynamic table ->Dynamic table
This is my calling main page ==>
<!doctype html>
<head> <meta charset=”utf-8” /> <title>jQuery Ajax – check status</title> <link href=”css/main.css” rel=”stylesheet” type=”text/css” /> <script type=”text/javascript” src=”jquery/1.7/jquery.min.js”></script> <script type=”text/javascript” src=”js/plugins/spinner/jquery.mousewheel.js”></script> <script type=”text/javascript” src=”js/plugins/spinner/ui.spinner.js”></script> <script type=”text/javascript” src=”jqueryui/1.8/jquery-ui.min.js”></script> <script type=”text/javascript” src=”js/plugins/wysiwyg/jquery.wysiwyg.js”></script> <script type=”text/javascript” src=”js/plugins/wysiwyg/wysiwyg.image.js”></script> <script type=”text/javascript” src=”js/plugins/wysiwyg/wysiwyg.link.js”></script> <script type=”text/javascript” src=”js/plugins/wysiwyg/wysiwyg.table.js”></script> <script type=”text/javascript” src=”js/plugins/flot/jquery.flot.js”></script> <script type=”text/javascript” src=”js/plugins/flot/jquery.flot.orderBars.js”></script> <script type=”text/javascript” src=”js/plugins/flot/jquery.flot.pie.js”></script> <script type=”text/javascript” src=”js/plugins/flot/excanvas.min.js”></script> <script type=”text/javascript” src=”js/plugins/flot/jquery.flot.resize.js”></script> <script type=”text/javascript” src=”js/plugins/tables/jquery.dataTables.js”></script> <script type=”text/javascript” src=”js/plugins/tables/colResizable.min.js”></script> <script type=”text/javascript” src=”js/plugins/forms/forms.js”></script> <script type=”text/javascript” src=”js/plugins/forms/autogrowtextarea.js”></script> <script type=”text/javascript” src=”js/plugins/forms/autotab.js”></script> <script type=”text/javascript” src=”js/plugins/forms/jquery.validationEngine-en.js”></script> <script type=”text/javascript” src=”js/plugins/forms/jquery.validationEngine.js”></script> <script type=”text/javascript” src=”js/plugins/forms/jquery.dualListBox.js”></script> <script type=”text/javascript” src=”js/plugins/forms/chosen.jquery.min.js”></script> <script type=”text/javascript” src=”js/plugins/forms/jquery.maskedinput.min.js”></script> <script type=”text/javascript” src=”js/plugins/forms/jquery.inputlimiter.min.js”></script> <script type=”text/javascript” src=”js/plugins/forms/jquery.tagsinput.min.js”></script> <script type=”text/javascript” src=”js/plugins/other/calendar.min.js”></script> <script type=”text/javascript” src=”js/plugins/other/elfinder.min.js”></script> <script type=”text/javascript” src=”js/plugins/uploader/plupload.js”></script> <script type=”text/javascript” src=”js/plugins/uploader/plupload.html5.js”></script> <script type=”text/javascript” src=”js/plugins/uploader/plupload.html4.js”></script> <script type=”text/javascript” src=”js/plugins/uploader/jquery.plupload.queue.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.progress.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.jgrowl.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.tipsy.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.alerts.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.colorpicker.js”></script> <script type=”text/javascript” src=”js/plugins/wizards/jquery.form.wizard.js”></script> <script type=”text/javascript” src=”js/plugins/wizards/jquery.validate.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.breadcrumbs.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.collapsible.min.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.ToTop.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.listnav.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.sourcerer.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.timeentry.min.js”></script> <script type=”text/javascript” src=”js/plugins/ui/jquery.prettyPhoto.js”></script> <script type=”text/javascript” src=”js/custom.js”></script> <script type=”text/javascript”> $(document).ready(function() { });
$(window).load(function(){ $(’#dvLoading’).fadeOut(2000); });
</script> <style> @font-face { font-family: ‘Cuprum’; font-style: normal; font-weight: 400; src : url(font/cuprum.ttf) format(‘truetype’); } @font-face { src: url(font/insda__-webfont.ttf) format(“truetype”); font-family: “INSDA”; /font-style: normal;/ } .normandy_f6 { font: 70px “INSDA”; } .normandy_f5 { font: 50px “INSDA”; } .normandy_f4 { font: 35px “INSDA”; } #dvLoading { background:url(images/loaders/loader7.gif) no-repeat center center; height: 19px; width: 220px; position: fixed; z-index: 1000; left: 50%; top: 50%; margin: -25px 0 0 -25px; } </style> </head>
<!- Top navigation bar -> <!—<cfoutput>#session.username# / #session.role#</cfoutput>—>
Profile 
Tasks 
Messages 8
- new message
- inbox
- outbox
- trash
Settings 
Logout
<!- Header -> exnovo prime- Support tickets 9
- Fund Analysis
- User list
- Billing panel
Initial content… © Copyright . All rights reserved. Perkasa Normandy Holdingscould you please try to load your pable without ajax, in a simple iframe? Just to check if everything is ok with datatable settings?
Hi Kopyov,
This is my iframe test ==> http://civet.viviotech.net/project_dark/index3.html
The datatable is taking from your sample. no extra setting.
Hi Kopvoy,
My iFrame solved thru different solution. BTW , i got question on multiple search selectbox. i do have search box + “Multiple with search” as the child. The “Multiple with search” is dynamically fill in data based on the search result. Data is retrieve via AJAX . Unfortunately, when i reload the data thru AJAx. The “Multiple with search” list does not refresh. How can i make it refresh and reflect the new data?
Thanx & regards,
Bakri
Hey
You can check this page, Change / Update Events section
Thanks
Hi Kopyov,
I got 2 issues today.
1. i try to put checkbox on dynamic table. when i go to second page, the checkbox is revert to ordinary checkbox. How can i solved this issue so all checkbox can have similar skin.
2. The tab selection state for tabbing. How can i detect n get the tab selected after i refresh a page. for example, if i click tab no 2, then i refresh the page. How can i make tab no 2 been selected.
Hope u can help me on this. I bit blurr on this technical part.
Regards
Bakri
1. Are you using Uniform plugin for forms styling? Or still JQtransform?
2. For now this is not possible without additional code. In the next update i will add jquery UI tabs, that is possible there. Current tabs are just a set of simple jquery functions and events. Or you can try to play with hashchange
Hi Kopyov,
How do i put 2 or more dynamic table in one page. I’ve try using your example some how only first table appear. 2nd n 3rd dynamic table failed.
Can u gimme hint how to implement this?
Thanks mate
Check for unique id’s for tables, or use classes which run datatables plugin instead of id’s
I am trying to put a form inside a JQuery Dialog and I can’t figure out how to make the Datepicker to not use the full width of the dialog. I am trying to make a dialog with a Label and two date picker (for start and end date) and using the same html as you have on ui_elements for date pickers, the input field is stretching to match the width of the dialog. I want that it will occupy only it’s size so I can put another one in the right. Thanks!
If you mean input field of datepicker has 100% width, edit styles for a specific datepicker class in ui_custom.css, because by default they have 100% width
.datepicker { width: 58px!important; }I guess it should have 58px right? And it is indeed growing to 100%. In the example page ui_elements.html you managed to have it the proper size, but it’s not inside the dialog. Any other hint?
in line 376, it should work
Hello,
first of all this is a very nice template! Is there a possibility to create a wizard in v2.0 ?
Regards Leo
Hey.
Thanks!
Wizard already implemented, on UI elements page
Dear Kopov, usually use the following js in various forms of your template in order to avoid duplication of transmission: <input type = “submit” value = “Submit” class = “greyishBtn submitForm” onClick = “if (this.value == ‘send’) this.form.submit (); this.value = ‘Please wait …’ ; this.disabled = true; ”/> ... But do not get it to work specifically in the “Wizard with validation – First.” How could adapt the above code, or what you’ve indicated earlier, in the form submit button type “Wizard”, as follows: <input class=”basicBtn” id=”back” value=”Back” type=”reset” /> <input class=”blueBtn” id=”next” value=”Next” type=”submit” />
I guess you need to edit a plugin file – jquery.form.wizard.js, you can add any values there for Submit button
Hi Kopyov, this is a really nice template!! I have a little problem, I want to create a buttons with other colours. It is possible to send me the PSD files of the buttons?? I try to create manually but this is not good. The shadows are not displaying like yours. I’m talking about the png files which are in /images/ui/*Btn.png.
Thank you!
Hey. Thanks for purchase!
I’d suggest you to wait a bit, i am working on a new update where i’ll replace images buttons with buttons with css3 gradients
So you’ll be able to edit button colors directly in css
Hi,
is it possible to define a custom progressbar in the document with <script>-tag ?
if i add following code and delete it from custom.js nothing happens:
<script type=”text/javascript”> setTimeout(function(e) { $( ”#progressbar” ).progressbar({ value: 19 }); }, 100) </script>
works but is there a clean solution?
You want just to use a progress bar with custom parameters and only on 1 page, did i get you correctly?
If yes, you can set a unique id to the div and use the same parameters from my demo, but with this id, so your code is correct
Hi again,
is there a class for a disabled Button ?
thanks
Hey.
What do you mean? Just a class or a part of some plugin?
I just need a styled disabled input button..
oh, general disabled button doesn’t have stylings i guess, but you can style it yourself by using
input[disabled] { // styles }or use a class, .disabled for example
Sorry for asking as much… i just want to draw a bar graph… i´ve added div class=”bars” id=”vBar”
like in the example and included all js but nothing is drawed… if i execute the code from bars.js in my javascript console the bars are shown … thanks
Maybe it´s caused trough this:
Uncaught Invalid dimensions for plot, width = null, height = null
Yes, that could be a problem. Just make sure you don’t have dublicated id’s for bars
Very good theme, thanks!
But there are two problems: 1. I have put the “Usual file input” in a valid form:<form action="" id="valid" class="mainForm">Now the input look unfavorable and works no longer: http://img7.myimg.de/inputf49cd.png 2. I would have that the file input is just an required field with an error message, too – How can i implement that?Thank you!
Hey.
Sorry, but i didn’t get your issue
And your link doesn’t work
I have uploadet it on another hoster: http://imageshack.us/f/27/workq.png/
I hope you see the problem? I just want a formular with inputs, the upload input und validaten after click “submit”
Hi there.
Could you please send me a direct link to your page? Seems like there is an extra padding, anyway i need to see the code.
Thanks
how can i add dynamic values in chosen select control? i cann’t , actually i have selected some values from DB and converted into json format, now i want to display it in select control….
Hi kopyov, i bought your its Brain Template and also updated with your latest version of 2.0, yeh of course very usefull controls like Chosen plugin – styled dropdowns with search
But, im not able to bind the dynamic values, please let me know, thx in advance
yeh! its get loading now, but search option seems to be perfect, Now search working for startswith
chosen search not working with special chars like ’_’ values… can you tell me how can we achieve this?
That is weird, it should work by default, also i didn’t find any related issues on github issue tracker. How did you solve your issue with dynamic values? There are standard solutions for this.