Hi there

First are you using the file assets/js/datatables.js ?

Maybe its because of the click area is not big enough.

If you have used assets/js/datatables.js demo JS script you will find the code

$('#example2 tbody td i').live('click', function () 

Change it to

$('#example2 tbody td.expand').live('click', function () 

and add the class “expand” to the TD with the icon “fa fa-plus-circle”

Thanks for your answer, I did what you suggested but unfortunatly the problem is still here … : The “details” row does open on normal device but it doesn’t on iOS device …

And I tried with your live preview there is the same problem..

Other suggestion ?

Thanks in advance !

Hi there

Really sorry about the late reply.

You should change it to the following it works that way

$('#example2 tbody td').on('click touch', function () 

Perfect it works now even only like this :

$(’#example2 tbody td i’).on(‘click’, function ()

But this icon fa-plus-circle / fa_minus-circle still doesn’t work … Sorry to ask you something else and thank you anyway !

Hi there

Maybe something is wrong with Paste bin I only see CSS and JS include list is that correct ?

I could update your code from here sure I’ll be happy to help you out

Ok so first thing is make sure

Data table scripts is loaded in the parent page

<script src="assets/plugins/jquery-datatable/js/jquery.dataTables.min.js" type="text/javascript" ></script>

<script type="text/javascript" src="assets/plugins/datatables-responsive/js/datatables.responsive.js"></script>
<script type="text/javascript" src="assets/plugins/datatables-responsive/js/lodash.min.js"></script>

Also may I ask why you had to import all the scripts ? your page will be very heavy, just a suggestion. That is why we recommend to start on barebone folder

Afterwards, when load the content via AJAX on the success event you append your content

$('#myContainer').append(data)

after that line you add the following

$('#example').datatable();
$('#example2').datatable();
$('#example3').datatable();

This happens because your DOM does not contain the elements when the page is loaded initially and the plugin needs to be initialized once the DOM is updated

Hi there

Have did you use the form_elements.js ? its not required to use it let me know

No, just use this form_validations.js

Ok if your using chrome press f12 go to the console tab and see if you can see any errors ?

No, only one warning in jquery-1.8.3.min:

Empty String for getElementById().

This is a bit strange, Is there anyway you can send me the HTML code ? or for me to see a live link ?

Hi there

Sure, follow the guide and make sure you download and include bootstrap-datatable.js

Hi Ace,

Thanks for helping me out. I’ve downloaded the code and copied it in the barebone but I still can only see the basic data table, can you tell me how I use the code you provided? Should I add the js files in the header and leave the default js files in use? Also where can I edit the functionality of the buttons of the app. I would like to controll the actions (example add or remove).

Hi there

The bootstrap-datatable.js should come after

<script src="assets/plugins/jquery-datatable/js/jquery.dataTables.min.js" type="text/javascript" ></script>
<script src="assets/plugins/jquery-datatable/extra/js/dataTables.tableTools.min.js" type="text/javascript" ></script>

We have shown it in the datatable.html file

It has to be in a correct order and its not a good practice to add it to the head.

Once you have done that include mycustom.js

after bootstrap-datatable.js. Thats it

Thanks Ace for helping me out, I really appreciate it.:) I tried the code but console trows: Uncaught SyntaxError: Unexpected token ) – mycustom.js:16. Also on what lines can I add buttons to the data table like “add, modify and delete”?

Hi there

Really sorry about that, my bad

I updated it

you can use the mycustom.js again

Alright thanks for the code update. However, I still only have one button “add” and I would like 2 more buttons “modify” and “remove”. Can you tell me maybe on what lines I should add htm code so I will have an “modify” and “remove” button? The code you provided doesnt do that?

Hi there

No the code that I provided only has add Feature were you able to set it up ? If not please let me know I will setup a separate HTML page with ADD feature so that it will not drag your task.

there is no function to Remove or Edit but I can setup a page for you, will that be ok ?

Hi Ace,

The add function works fine, thanks.

I will create an remove and edit function myself in python, no problem.

The thing is that I don’t know how I can add the buttons “edit” & “remove” to the data table.

I think it has to be done somewhere in datatables.js in javascript but I don’t know where. So basicly what I want is a data table with 3 buttons: “add”, “edit” and “remove” and I want to them to call javascript or send a submit or whatever (I will controll the action) but first I need to know how I add the button.

Solved. Solution:

var oTable = $('#example2').dataTable( {
    "sDom": "<'row'<'col-md-6'l T><'col-md-6'f>r>t<'row'<'col-md-12'p i>>",
        "oTableTools": {
        "aButtons": [
            {
                "sExtends":    "text",
                "sButtonText": "<button type='submit' class='btn btn-white'></button><button type='submit' class='btn btn-white'></button><button type='submit' class='btn btn-white'></button>",
            }

Hi there

Can you check if the following code is there in CSS or LESS depending on what your using ?

body.modal-open .page-container {
position: inherit;
}

*iso => iOS

Glad you like it In order to assist you, I’d like to know the following:

• Are you referring to this widget
• Have you included the necessary plugin JS/CSS?
• Do you see any JS errors/404 errors in the console?

hii there

I am talking about http://screencloud.net/v/3ouW widget which keeps sliding upwards. How to know which JS/CSS needs to be included? No there is no error.

It is getting overlapped like in http://screencloud.net/v/F6q4

Can you please send us a demo link to support@revox.io so that we can do a test from our end. Thanks.

hii, It is on my local environment.can I share code with you?

Sure! what is it in php ?

I have send an HTML code to given email id with subject “HTML Code of Slider”.

And also, can you please provide me the steps to install new icons in this template (if it is possible to install)?

thanks

I have send an HTML code to given email id with subject “HTML Code of Slider”.

And also, can you please provide me the steps to install new icons in this template (if it is possible to install)?

thanks

Hi there Sure ill check it up! and yes you everything goes inside the assets/plugins/ folder and then you link it back on you HTML

is it a font icon set ?

ok No its an image and i wanted to use it as an icon.

Hello ace,

dropzone is not working. I inclded: <script src=”assets/plugins/dropzone/dropzone.min.js” type=”text/javascript”></script>

<link href=”assets/plugins/dropzone/css/dropzone.css” rel=”stylesheet” type=”text/css”/>

Please let me know what i am missing. my code is:

Hello ace,

dropzone is not working. I inclded: <script src=”assets/plugins/dropzone/dropzone.min.js” type=”text/javascript”></script>

<link href=”assets/plugins/dropzone/css/dropzone.css” rel=”stylesheet” type=”text/css”/>

Please let me know what i am missing. my code is:

Hi there

You have done it correctly

Could you have the div structure as the following way

                    <form action="/file-upload" class="dropzone no-margin">
                      <div class="fallback">
                        <input name="file" type="file" multiple />
                      </div>
                    </form>

and also included the following JS code

and see how it turns out to be ? Also is there any JS error in the console log ?

Hello Ace, Still not working. I put that script in my code between script tag. and No js error is being shown. the form is enclosed in another form. if i run it separately, it works fine, but if thie (<form action=”/file-upload” class=”dropzone no-margin”>) form in another form, it is not working.

Hello Ace, Still not working. I put that script in my code between script tag. and No js error is being shown. the form is enclosed in another form. if i run it separately, it works fine, but if this (<form action=”/file-upload” class=”dropzone no-margin”>) form is in another form, it is not working.

Hello Ace, Still not working. I put that script in my code between script tag. and No js error is being shown. the form is enclosed in another form. if i run it separately, it works fine, but if this (<form action=”/file-upload” class=”dropzone no-margin”>) form is in another form, it is not working.

Hello Ace, Still not working. I put that script in my code between script tag. and No js error is being shown. the form is enclosed in another form. if i run it separately, it works fine, but if this (<form action=”/file-upload” class=”dropzone no-margin”>) form is in another form, it is not working.

Hello Ace, Still not working. I put that script in my code between script tag. and No js error is being shown. the form is enclosed in another form. if i run it separately, it works fine, but if this (<form action=”/file-upload” class=”dropzone no-margin”>) form is in another form, it is not working.

Hi there Why is your comment being spamed :/ you will get marked as spammed by envato

Also I had a look around the multiple form is the thing thats causing the issue you can do something like this

Hello, I m sorry man but after adding a reply, it gets vanished on refreshing the page and i thought some error might have occurred so i kept sending Anyway, dropzone is still not working so i am definitely doing something wrong. Can i share the code with you? and also, previously i shared that sliding widget thing please let me know the way around.

Hi there That alright any can you drop me your html code and js too ? I will try myself and see too

I have sent you the code..

Dear Ace, Please come back..

Hi there

Im really sorry about this delay, loads of request and we are running out of resources to handle, hope you understand our situation I will ask my colleague to check it up tomorrow as I will be taking the day off

hello there.. I totally understand.. thanks and have a good time..

Hi there Just having a look at your code

thanks man..

Mailed

hello Ace, Thank you so much. Finally i got dropzone working but the wizard is not moving ahead after second step. (there was already this error in the code i sent you.) The js errors are —>”Error: No URL provided.” —>”TypeError: this⁰ is undefined”

P.S.: I think root cause of my problem is improper loading of js while customizing the template. Is there any hint i can smoothly manage the JSs? It would really help me as i think i am wasting your time too.. and also, I have sent an email 10 days ago regarding “sliding widget”. I am trying different combinations but still it is not working.

thanks a lot..

Hey Ace, that sliding widget thing is working now.. (wizard thing is not )

Hi there Wish you a very happy Holiday sorry about the delays its season time

about the html file that I sent you does not have an js Error, can you check it up in your end, Did you use the html file I sent or you altered the code ? let me know

Merry Christmas Ace..

I have not altered the code. Error log is:

Use of getPreventDefault() is deprecated. Use defaultPrevented instead. jquery-1.8.3.min.js:2 ReferenceError: require is not defined form_elements.js:7 Using //@ to indicate sourceURL pragmas is deprecated. Use //# instead ios7-switch.js:64 Using //@ to indicate sourceURL pragmas is deprecated. Use //# instead ios7-switch.js:1 Use of Mutation Events is deprecated. Use MutationObserver instead. jquery-1.8.3.min.js:2 Error: Dropzone already attached. dropzone.min.js:1

—-After clicking on next/Previous Empty string passed to getElementById(). jquery-1.8.3.min.js:2 TypeError: this⁰ is undefined jquery.validate.min.js:2 Empty string passed to getElementById(). jquery-1.8.3.min.js:2

thank you

For better view :

• Use of getPreventDefault() is deprecated. Use defaultPrevented instead. jquery-1.8.3.min.js:2
• ReferenceError: require is not defined form_elements.js:7
• Using //@ to indicate sourceURL pragmas is deprecated. Use //# instead ios7-switch.js:64
• Using //@ to indicate sourceURL pragmas is deprecated. Use //# instead ios7-switch.js:1
• Use of Mutation Events is deprecated. Use MutationObserver instead. jquery-1.8.3.min.js:2
• Error: Dropzone already attached. dropzone.min.js:1
• —-After clicking on next/Previous
• Empty string passed to getElementById(). jquery-1.8.3.min.js:2
• TypeError: this⁰ is undefined jquery.validate.min.js:2
• Empty string passed to getElementById(). jquery-1.8.3.min.js:2

Hi there

No they are not errors deprecated are just warnings which you can ignore and it will not cause any problem.

This is something that is causing the problem TypeError: this0 is undefined jquery.validate.min.js

I think you have missed the validation, the next button triggers a function in form wizard

    $('#rootwizard').bootstrapWizard({
              'tabClass': 'form-wizard',
              'onNext': function(tab, navigation, index) {
                  var $valid = $("#commentForm").valid();
                  if(!$valid) {
                      $validator.focusInvalid();
                      return false;
                  }
                else{
                    $('#rootwizard').find('.form-wizard').children('li').eq(index-1).addClass('complete');
                    $('#rootwizard').find('.form-wizard').children('li').eq(index-1).find('.step').html('<i class="fa fa-check" />');    
                }
              }
     });     

onNext

$("#commentForm").valid()

You need to define your validation

    var $validator = $("#commentForm").validate({
          rules: {
            emailfield: {
              required: true,
              email: true,
              minlength: 3
            },
            txtFullName: {
              required: true,
              minlength: 3
            },
            txtFirstName: {
              required: true,
              minlength: 3
            },
            txtLastName: {
              required: true,
              minlength: 3
            },
            txtCountry: {
              required: true,
              minlength: 3
            },
            txtPostalCode: {
              required: true,
              minlength: 3
            },
            txtPhoneCode: {
              required: true,
              minlength: 3
            },
            txtPhoneNumber: {
              required: true,
              minlength: 3
            },
            urlfield: {
              required: true,
              minlength: 3,
              url: true
            }
          },
          errorPlacement: function(label, element) {
                $('<span class="arrow" />').insertBefore(element);
                $('<span class="error" />').insertAfter(element).append(label)
            }
        });

This is all shown in form_validation.js do not use that file but extract the required code

Let me know

Hi

Sent you can email

Ace, you are AWESOME.. thanks a lott..

hi there, how are you?

I am creating a modal pop up, in which i need bootstrap wizard. Now modal pop up works in bootstrap version 3, and wizard works on bootstrap version 2. how to remove confliction between these two? is there any way i can make both of them work with same bootstrap version?

Hi there

Sorry about that, please update the current bootstrap form wizard js if your using the min file

and here is the entire project

Hi Ace, is there any way to get rid off from export feature of data tables? on clicking of the export dropdown,options fall for the formats, but they did not toggle on clicking dropdown again.. thanks..

Hi there

In you script that you have initialized the datable you will find an attribute

“oTableTools” remove the entire block it will look like this

"oTableTools": {
            "aButtons": [
                {
                    "sExtends":    "collection",
                    "sButtonText": "<i class="fa fa-cloud-download" />",
                    "aButtons":    [ "csv", "xls", "pdf", "copy"]
                }
            ]
},

Did you the script int assets/js/datatables.js ?

hi there.. i did but its worse now. PFA screenshot: http://screencloud.net/v/9aNK

Alright can you try removing the following script

<script src="assets/plugins/jquery-datatable/extra/js/dataTables.tableTools.min.js" type="text/javascript" ></script>

That is at the bottom of the page and do try to avoid using assets/js/datatables.js and create your own JS file.

on doing this, the search box also got disappeared.. (can i keep it and remove all the export buttons?)

Is it possible for me to see your html and js code? you can drop it over to support@revox.io