1773 comments found

  • Exclusive Author
  • Has been a member for 2-3 years
  • Bought between 1 and 9 items
larceniii Purchased

How well do you think this template will work with ember.js?

displayinline

Hi,

Well, I don’t think I know enough about Ember.js to give you a definitive answer, sorry… The only issue I cna think of that may arise would be if Ember breaks the internal references of the template plugins by changing the DOM repeatedly, as some buyers have reported when using other templating engines – but that is common to many JS plugins.

There are several ways to fix this, from custom callbacks to re-instantiate the plugins to fine tuning in Ember rendering methods so they don’t break anything (though I don’t know if this can be done).

Long story short, Ember.js should work fine with the template, but you may need to tweak it a little bit.

If anyone here has already used Ember.js with this template, I’d be glad to hear your thoughts! ;)

Default-user
larceniii Purchased

Thanks, initially just dropping it in seems to work fine. I’ll load a large sample app and see how it works.

  • Bought between 1 and 9 items
  • Has been a member for 1-2 years
  • United States
UITS Purchased

Congrats on the 1.5 release!

displayinline

Thanks! :)

  • Australia
  • Bought between 1 and 9 items
  • Has been a member for 1-2 years
Puruzweb Purchased

Thanks for the v1.5. Most of the issues been fixed…Cheers !!!!

displayinline

Yep, it was about time! ;)

  • Bought between 10 and 49 items
  • Has been a member for 3-4 years

Can I edit this template with dreamweaver

displayinline

Hi,

You should be able to edit it with almost any code editor, but the WYSIWYG view of Dreamweaver won’t probably be able to display correctly the template, due to many advanced components.

However, you should be able to work on it, just remember to check the result in the browser.

Tell me if you need more details! :)

  • Exclusive Author
  • Has been a member for 1-2 years
  • Bought between 10 and 49 items
koza95 Purchased

Hello :)
Is option to replace standard scroll bar on iframe modal to custom scroll bar like here:

http://scr.hu/6jr/5i31c ?
Thanks in advance for answer :)

displayinline

Hello!

Unfortunately, the custom scroll plugin can’t be used for window/frames, it was not designed to work this way.

But you can use this workaround: wrap your content in a div with height: 100%, and add the custom scroll to this div.

Tell me if you need more details! :)

  • Bought between 1 and 9 items
  • Exclusive Author
  • Has been a member for 1-2 years
  • United Kingdom
pcross Purchased

Hi,

I have an issue with the mediaQueries. Chrome, the page loads fine, when I alert the $.template.mediaQueries.name value it shows Desktop.

However, in internet explorer, with the same computer, I get mobile-portrait which stops the side menus appears. I have a widescreen, hi-res monitor so not entirely sure why its showing up as mobile-portrait!

Any ideas what would cause this? Many thanks Phil

displayinline

Hi,

This happens because IE < 10 has no support for media queries, therefore a JS polyfill is used (Respond.js). The template loads it dynamically, so it needs to know the path to the JS file: it is defined in setup.js, with the line:

respondPath: 'js/libs/',

This was not the easiest solution, so since v1.5 the template use dynamic path detection. Just replace the line above with this one if you want to use it too:

respondPath: $('script').last().attr('src').replace(/[^\/]+$/, '')+'libs/',

Everything should work fine on IE then. Tell me if you need more details! ;)

Default-user
pcross Purchased

Hi display, thanks for your quick and informative reply! Its helpful to know whats causing the issues :)

Unfortunately the respond path is correct, I’ve tried ‘js/libs/’, ‘http://website.com/js/libs/' and also loading the respond file directly but all still don’t fix the problem :(

I have also checked the file is where it is supposed to be.

Any other ideas? Thanks! Phil

displayinline

Hi,

This is surprising, usually this solve the problem… Hard to tell what’s not working without seeing the actual page. Do you have any errors showing in the browser’s status bar or console?

If you have an online demo I may check, I will give it a look to see if I can find the solution ;)

Default-user
pcross Purchased

Thank you for your always helpful replies! Unfortunately the problem was one of my mistakes! I transfered the site from a development to production server and forgot to change some of the domains on the CSS style sheets (IE 2x.css, etc). Changing them to the production server address has solved the issue.

Again, many thanks for your time :)

Phil

displayinline

Great to hear it works now ;) I was wondering if I had let some hidden bug slip into production…

Feel free to ask if you have any other question!

  • Bought between 1 and 9 items
  • Has been a member for 1-2 years
  • Mexico
rolperez Purchased

Hi Display!

How can i validate a group of checkboxes? i need 1 select at least, but validator always says “false”, can you help me?

Thanks!

displayinline

Hi!

Did you try using the minCheckbox[] validator? It seems to do what you are looking for ;)

  • Bought between 10 and 49 items
  • Has been a member for 4-5 years
  • United States

Congrats on the new version – I’ll be tackling the upgrade soon!

This may already be fixed in the new version, but I found that I was having trouble with using *-columns-tablet-portrait or *-columns-tablet-landscape as a column definition. I checked the styles.css and they don’t seem to be defined anywhere. Is that fixed in the update?

displayinline

Hi, and thanks! :)

About the columns issues, this has been fixed in v1.5 indeed: it was a CSS precedence issue.

Just to let you know, columns are defined in several stylesheets: style.css, 480.css, 768.css and 1200.css – this is required to make them fully responsive.

Tell me if you still have issues after upgrading!

  • Bought between 1 and 9 items
  • Has been a member for 1-2 years
zsystems Purchased

Congrats on the 1.5 update. Really looking forward to checking it out. In the meantime, I have a question about the modal plugin. Is it possible to have the dialog be modal to a div, as opposed to the entire window? I’ve created a tabbed interface and would like to have modal dialogs for certain views and forms but would like to constrain the modal to the tab in which it was triggered. This will allow a user to work in other areas and come back to the modal dialog at a later time.

Thanks!

displayinline

Hi, and thanks! :)

On your question, this is not possible by default, but you may do something like this: set the modal option blocker too false (so the user can still interact with elements in the background), store the list of open modals for each tab it the tabs themselves, then hide/reveal them using the showtab and hidetab events.

Here’s a quick draft, in 2 parts:

A function to open modals bound to a tab

function openTabModal(tab, options)
{
    var modal, list;

    // Open modal
    modal = $.modal($.extend(options, {
        blocker: false,
        onClose: function()
        {
            var i, list = tab.data('modals') || [];

            // Remove from list
            for (i=0; i<list.length; ++i)
            {
                if (list[i] === this)
                {
                    list.splice(i, 1);
                    --i;
                }
            }
        }
    }));

    // Store it
    list = tab.data('modals') || [];
    list.push(modal.get(0));
    tab.data('modals', list);

    // Hide if tab is hidden
    if (tab.is(':hidden'))
    {
        modal.hide();
    }
};

The code to hide/show those modals

$('.tabs-content > div').on('showtab', function()
{
    var list = $(this).data('modals') || [];
    if (list.length)
    {
        $(list).show();
    }
});

$('.tabs-content > div').on('hidetab', function()
{
    var list = $(this).data('modals') || [];
    if (list.length)
    {
        $(list).hide();
    }
});

Simply open modals using the function:

openTabModal($('#tabId'), {
    title: 'Modal window',
    content: 'Some content.'
});

And the code will take care of showing or hiding them when the corresponding tab is shown.

Hope this helps! ;)

Default-user

Thanks! I’ll give it a try.

Default-user

dup

Default-user

Wow, this comment system is borked.

  • Bought between 1 and 9 items
  • Has been a member for 1-2 years
  • United States
UITS Purchased

Here are the issues I’ve noticed while migrating from the 1.4 to 1.5 version:

  • Still reference “CLEditor” in your comment above the JS path to ckeditor
  • Missing index.html link to css/styles/calendars.css
  • I’m not sure what ”?v=1” does but if you’re trying to update the cache for the 1.5 release you may want to indicate ”?v=1.5”
  • Path to iPad retina splash screens should be “img/splash/ipad-...” instead of the current “img/ipad-...”
  • This ckeditor bug still present in your included version: http://dev.ckeditor.com/ticket/6317
  • ”$(’.navigable’).navigableReset();” makes the menu list disappear (<section cleass=”navigable’ id=”doc-menu” style=”height:0px;”>)

Missing in doc version of index.html:

<!- iPhone ICON ->
<link rel="apple-touch-icon" href="img/favicons/apple-touch-icon.png" sizes="57x57">
<!- iPad ICON ->
<link rel="apple-touch-icon" href="img/favicons/apple-touch-icon-ipad.png" sizes="72x72">
<!- iPhone (Retina) ICON ->
<link rel="apple-touch-icon" href="img/favicons/apple-touch-icon-retina.png" sizes="114x114">
<!- iPad (Retina) ICON ->
<link rel="apple-touch-icon" href="img/favicons/apple-touch-icon-ipad-retina.png" sizes="144x144">
<!- iPhone SPLASHSCREEN (320x460) ->
<link rel="apple-touch-startup-image" href="img/splash/iphone.png" media="(device-width: 320px)">
<!- iPhone (Retina) SPLASHSCREEN (640x960) ->
<link rel="apple-touch-startup-image" href="img/splash/iphone-retina.png" media="(device-width: 320px) and (-webkit-device-pixel-ratio: 2)">
<!- iPhone 5 SPLASHSCREEN (640×1096) ->
<link rel="apple-touch-startup-image" href="img/splash/iphone5.png" media="(device-height: 568px) and (-webkit-device-pixel-ratio: 2)">
<!- iPad (portrait) SPLASHSCREEN (748x1024) ->
<link rel="apple-touch-startup-image" href="img/splash/ipad-portrait.png" media="(device-width: 768px) and (orientation: portrait)">
<!- iPad (landscape) SPLASHSCREEN (768x1004) ->
<link rel="apple-touch-startup-image" href="img/splash/ipad-landscape.png" media="(device-width: 768px) and (orientation: landscape)">
<!- iPad (Retina, portrait) SPLASHSCREEN (2048x1496) ->
<link rel="apple-touch-startup-image" href="img/ipad-portrait-retina.png" media="(device-width: 1536px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2)">
<!- iPad (Retina, landscape) SPLASHSCREEN (1536x2008) ->
<link rel="apple-touch-startup-image" href="img/ipad-landscape-retina.png" media="(device-width: 1536px)  and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2)">

Missing in html version of index.html:

<link rel="stylesheet" href="css/styles/files.css">
<link rel="stylesheet" href="css/styles/table.css">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
displayinline

Hi, thanks for the detailed report!

I fixed the typos, I will make sure to push this to production as soon as possible. About the missing stylesheets, it depends on the elements you wish to use on these pages, by default they are not required.

About CKEditor, in included the latest available version, so it is strange that this very old bug still persists… Can you tell me more?

I could not replicate the navigableReset() issue, can you give me more details? For instance, does it happen in every browser, the markup you use… Once I have more information I’ll check how to fix this ;)

UITS
UITS Purchased

No worries on the stylesheets, I use developr as a template so I like to have all stylesheets listed but commented-out in my index.html. When upgrading, I just compare my full list with the index.html pages for doc and html as well as your documentation to verify I haven’t missed any new ones.

The ckeditor bug is minor, they added a closing </frame> tag which the <frame> element doesn’t support. The patch included in the bug report is simple: just delete the four </frame> inclusions. They also have 11 errors in their minified ckeditor.js file but they don’t impact usability of the plugin.

I’m sure the navigableReset behavior is specific to my implementation. Let me know your BitBucket (https://bitbucket.org/) username and I’ll add you to the repository so you can peruse the code.

UITS
UITS Purchased

Also, version 1.5 states 284 Entypo icons are now available but doc/#content/basic/icons.html still only shows 122

Regarding the navigableReset issue, I’ve been able to verify this only occurs when the menu is hidden (tablet portrait and lower in my implementation) so my guess is JavaScript is calculating menu height but because the menu is hidden it receives a 0 or NaN and then accordingly sets menu height to 0.

displayinline

Hi,

Indeed, someone just warned me that the icons page in the documentation does not include the complete icons set, but you can see the full list in the example page icons.html in folder html. I am going to fix this quick.

About the navigableReset() issue, I made a few tests under several browsers, and couldn’t replicate it. Actually, when the menu is closed, it is only off-screen but not really hidden. But this is maybe something related.

For Bitbucket, you can add displayinline to your repo, I’ll check the code then. ;)

UITS
UITS Purchased

Great, I’ve added you with read-access. The issue is described in https://bitbucket.org/uitsweb/mazer/issue/3/menu-option-disappear-when-invoking You can install a trial-version of Icenium Graphite (Windows) or Mist (Mac/Linux) and then click on the “Clone” button in the top menu and use “https://bitbucket.org/uitsweb/mazer.git” for the Repository Uri. Once the project loads, you can click “Run > In Simulator” from the top menu and then follow the BitBucket issue #3 instructions to replicate the bug.

displayinline

Hi!

I finally managed to replicate the issue, and added a fix in the navigable menus plugin. It seems to work fine now, you can get it here.

Tell me if you notice any other issue! :)

UITS
UITS Purchased

Worked like a charm – thanks!

displayinline

Glad I could help, and thanks for the feedback!

  • Bought between 1 and 9 items
  • Has been a member for 1-2 years

Hi Display,

Is there an easy way to apply or remove the multiple style to a select dynamically? I am trying to add the multiple option when a user selects a particular option in another select input. I am trying the following code but it seems like it’s applying the class to the inner element and not the styled element:

$('#ComparisonOperatorID').change(function () {
       var selectOperatorID = $(this).val();
       if (selectOperatorID == '2') {
                $('#RuleValue').addClass('multiple-as-single easy-multiple-selection check-list multiple');
        $('#RuleValue').trigger('silent-change');

            }
});

Thanks!

displayinline

Hi!

You may do the following:

  • Remove select styling
  • Add multiple option
  • Enable styling back

This way, the internal references and callbacks will be correctly set. Here’s how to do this simply:

$('#RuleValue').applyClear(true)
    .prop('multiple', true)
    .addClass('multiple-as-single easy-multiple-selection check-list')
    .applySetup(true);

And to revert to single select, just do the opposite:

$('#RuleValue').applyClear(true)
    .prop('multiple', false)
    .removeClass('multiple-as-single easy-multiple-selection check-list')
    .applySetup(true);

Tell me if you need more details! ;)

Default-user

Worked like a charm, thank you sir!

displayinline

Glad I could help :)

  • Bought between 1 and 9 items
  • Has been a member for 5-6 years

Hello,

I am trying to use this template outside of the folder, as in the html file is outside of the directory containing the css and js and img files. Right now I am stuck with a problem regarding the login form provided. While i corrected the path and everything seems to load up correctly, the actual input box displays no text. This issue only arises in Firefox, Chrome seems to work properly. Would you have any ideas as to what is happening, or is the actual page require?

  • Bought between 1 and 9 items
  • Has been a member for 2-3 years
rfu3 Purchased

Hi,

Love the template and thank you for your dedication. It is impressive that you constantly provide such high quality support for everyone. Just upgrading to 1.5 and I was looking for updated documentation relating to the fixed items. I wasn’t able to find updated icon names, how to activate black radio box, example for back/forward history amongst other new features. The 1.5 documentation in the package doesn’t seem to be updated, is this information elsewhere?

displayinline

Hi! :)

Indeed, the icons page in the documentation is not up-to-date, I am going to fix this quick! Thanks for pointing that out. In the meantime, you can see the complete icons set in the example page icons.html, in the folder html.

To activate the black radio style, simply add the class black-inputs to any of its parent – you may even go up to the body element if you want all inputs to use the black theme. This is not clear in the documentation, I’ll change that too!

Regarding the back/forward history, I simply included a example implementation I gave to a user some time ago, you will find the complete working code in the example page explorer.html (the two code blocks above $.template.init();).

Tell me if you need more details or if you have any other question! ;)

  • Bought between 10 and 49 items
  • Has been a member for 3-4 years
  • United States

We need a developer with experience with Intranet systems to take your template and build it for us with all of our integrated features. Do you have any suggestions please?

displayinline

Hi,

Unfortunately, I have no one to recommend you right now, sorry. You may try to post a message on the forum, you will find many talended developers there!

  • Bought between 1 and 9 items
  • Has been a member for 1-2 years
zepar Purchased
I’ve seen other people have this issue and it turns out it was the issue I was having earlier but thought it was an upgrade issue. If you use scrolling with sorting then the CSS for datatables selector will cause a duplicate header row with just the sortable symbol on it. The problem is this area in the CSS.
.sorting:before {
    content: '';
    display: inline-block;
    width: 7px;
    height: 10px;
    vertical-align: middle;
    background: url(../../../img/standard/sprites.png) no-repeat -137px -8px;
    margin: -1px 4px 1px 1px;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
    filter: alpha(opacity=30);
    -khtml-opacity: 0.3;
    -moz-opacity: 0.3;
    opacity: 0.3;
}
.sorting_asc:before,
.sorting_desc:before {
    font-size: 0.75em;
    padding-right: 2px;
    vertical-align: 0.15em;
    }
    .sorting_asc:before {
        content: '?';
    }
    .sorting_desc:before {
        content: '?';
    }

The selector will match twice. I made the selector more discriminating by changing it to this

div.dataTables_scrollHeadInner table.dataTable th.sorting:before

and it does fix the problem but only works on tables where scrolling is enabled. I’m not the best at CSS so a more general purpose solution that works on tables whether they are being scrolled or not is needed.

Thanks!

displayinline

Hi!

I had never seen this issue before, thanks for pointing that out! Your solution is fine, I just tweaked it a little to disable the sort arrows in scrolling tables instead:

jquery.datatables.css

.dataTables_scrollBody .sorting:before {
    display: none;
}

jquery.datatables-simple.css

.dataTables_scrollBody .sorting_asc:before,
.dataTables_scrollBody .sorting_desc:before {
    display: none;
}

It seems to work fine here, tell me if you notice any other issue! ;)

  • Bought between 1 and 9 items
  • Has been a member for 2-3 years
rfu3 Purchased

I have a really strange issue with GLDatePicker and an input box with datepicker class within a table cell. Using Developer v1.5 and GLDatePicker 2.0. The first time I click on the input box, depending on some other CSS, the calendar will display in the top left or way off to the right. If I don’t select anything it will do the same each subsequent time. If I select a date, then the next time I click it, it will display the calendar aligned with the bottom of the input box as it should.

If I turn off DataTables it works fine. I’m using fixed but get massively erroneous calendar placement on just default. Again, it works if the cell is outside of the datatable. I have analysed with IE Developer Tools but cannot find much difference between when it works and when it doesn’t (it did add a class called focus but I think that is a red herring). I hope you can help…

displayinline

Hi,

I made some tests, and it seems the glDatePicker plugin fails to set the correct position in this particular case, but only in IE8 and lower (other browsers work fine, at least in my tests).

To fix this you can trigger a resize event on the window element to force the plugin to position the datepicker again:

$('.datepicker').glDatePicker({
    zIndex: 100,
    onShow: function(calendar)
    {
        calendar.show();
        $(window).resize();
    }
});

This seems to work fine here, tell me if you notice any issue! ;)

Default-user
rfu3 Purchased

Hi, I think I have a slightly different problem to this but thanks for the quick response. Your advice did help my troubleshooting and I identified that it is not working when I have horizontal scrolling enabled on my table. If I encase my table in a div with “style=”overflow-x: scroll;”, or I use the built in datatables scrolling (sScrollX=”100%”), the datepicker appears in an irregular position on the page. I am on IE9/IE10.

Default-user
rfu3 Purchased

Also, removing my custom column widths makes datepicker position correctly too. So it is fixed width and custom column widths causing the issue. It doesn’t matter if I set them with sWidth or via CSS on the TH elements, the datepicker moves off to the right.

Strangely if I put the gldatepicker initiator before the datatables initator, within document ready, it ends up in a slightly neater fixed position, but still does not snap to the input.

Default-user
rfu3 Purchased

I have managed to get this working with the jQuery UI datepicker. No issues so far.

displayinline

Thanks for your feedback! Sorry the bundled datepicker doesn’t work as expected in your case – but jQuery UI’s datepicker is great too :)

  • Bought between 1 and 9 items
  • Has been a member for 5-6 years

The problem was on our end, the HTML document was not valid, and as such elements were breaking. Doing further testing it seems that “login.html” is not displaying “Password” as the placeholder value in the password field in IE9, is there any way to fix this?

displayinline

Hi,

Glad to hear you found the issue!

About the placeholder, this happens because IE9 (and lower) has no support for placeholders, so a polyfill is used. But it is impossible to force a password input to display a legible text (it would only show *), so this kind of input is ignored.

Tell me if you have any other question or issue! :)

  • Bought between 1 and 9 items
  • Has been a member for 3-4 years

Hi,

I am using the ajax loading for pages but am having trouble submitting a form with the Post method. The page refreshes but the form doesn’t post. Is there something I need to do to get it to post?

displayinline

Hi,

Actually, the template does not interfere at all with forms. Hard to tell what’s not working without seeing the actual code…

Can you give me some more details? If you can show a sample of the code you use, or if you have an online demo I may check, I will see if I can find what’s wrong ;)

  • Bought between 10 and 49 items
  • Has been a member for 4-5 years
  • United States

Here’s a strange issue I’ve run across since upgrading to 1.5. I’ve got a Fields List form layout setup using your responsive columns like this:

            <div class="field-block button-height">
               <label class="label"><b>Revenue</b></label>
              <div class="columns">
                 <div class="five-columns twelve-columns-tablet">
                    <p class="button-height">
                       <input type="text" name="pm_total_cost" id="pm_total_cost" 
                        class="input align-right" 
                        value="">
                    </p>
                 </div>
                 <div class="seven-columns twelve-columns-tablet"> 
                 <p class="button-height" id="showProbability">
                    <input type="text" name="pm_probability" id="pm_probability" 
                           value="#getProject.pm_probability#" 
                           class="input demo-slider large" size="3" 
                           data-slider-options='{"size":250,"innerMarks":20,"step":20,"knob":true,"tooltip":"top","topMarks":[{"value":0,"label":"0%"},{"value":20,"label":"20%"},{"value":40,"label":"40%"},{"value":60,"label":"60%"},{"value":80,"label":"80%"},{"value":100,"label":"100%"}],"insetExtremes":true,"barClasses":"green-gradient"}'>
                 </p>
                 </div>
              </div>
            </div>

It was working OK before the upgrade across all browsers. Since the upgrade, Internet Explorer seems to be setting some sort of left margin on the columns definition. Chrome and Firefox are OK.

Any clues?

displayinline

Hi!

Well, IE has no rival when it comes to breaking something that works everywhere else… It looks like the label element causes the left margin of the first column to be doubled, I don’t know why. Just remove the label, and everything works fine… Weird.

None of the usual tricks and hacks seemed to have any effect on this, but I managed to find a fix using position: absolute on the label element:

<label class="label" style="position: absolute"><b>Revenue</b></label>

It seems to work fine here. The only drawback is that if your label is long enough to break on two lines, the wrapping element won’t resize.

I’ll continue to investigate on this, I’ll let you know if I find a better solution.

Tell me if you still have issues with this! :)

ListingWareBob

In this case, the Revenue label was being placed properly. It was the column definition just after it that was thrown off. If I entered anything else in place of the column div (like an INPUT), it was placed properly. It was only when I tried to define a column set within the Field Block where there would be an extra left margin on the first column.

For now, I’ve just setup an IE-only CSS rule like this:

.field-block > .columns > div:first-child {
        margin-left: 0;
}

That seems OK, but I would like to find a permanent solution to it. Thanks.

  • Bought between 10 and 49 items
  • Has been a member for 5-6 years

I’m having a difficult time getting validation to work in a modal bos that contains 2 selects and a datepicker..

I add the classes (validate[required])

I have tried adding $(‘form’).validationEngine(); to a script tag in the file pulled in thru the modals content option and also in the parent file. nothing seems to work.. It does break the datepicker when I try it..

Any suggestions?

displayinline

Hi,

Hard to tell without seeing the actual code: do you have an online demo I could check? If so, I should be able to help ;)

Also, inline scripts may fail for multiple reason: in this case, you may use the ajax success callback when opening the modal instead:

var modal = $.modal({
    title: 'Ajax content',
    url: 'ajax-content.php',
    ajax: {
        success: function()
        {
            modal.find('form').validationEngine();
        }
    }
});

Hope this helps a little! ;)

Default-user

Cool, I will give that a go!

by
by
by
by
by
by