Skip to:
Content
Pages
Categories
Search
Top
Bottom

BP 1.5 Beta 3: Dropdown Menu: Clicking on drop down menu in Safari causes page reload but not in Fir

  • Avatar of Quint
    Quint
    Participant

    @qrahaman

    I am running the latest version of WordPress (multisite enabled), BP 1.5 Beta 3, Safari 5.1, and Firefox 6.02, OSX Lion. bbpress is the only other plugin network-enabled.

    I have added a new group to XProfile and then added a few field types including a couple versions of the dropdown fields. The first version has a default value selected, while the other has no default selected.

    As an Admin, I navigated to my site, then to my Profile, then Edit, and then tried to select my first version of the dropdown field. Doing so, immediately causes a reload of the webpage. Plus, if I have any other tabs in my browser to other sites, each one of them reloads itself when I select the tab. This also happens when I select the second version of the drop downfield.

    I’ve applied the same steps in Firefox but it behaves as it should. Selecting either dropdown field actually “drops down” and provides me options to choose from. I did that for both fields, and saved. Then viewed in “Public”. My dropdown choices showed up as intended.

    Then I installed Buddypress Docs, and as an Admin for one the Groups, I checked the “Enable Buddypress Docs for this group”, which then provided the option of “Minimum role to create new Docs:”–a dropdown field. I selected that dropdown field, and the same result happened as described above: a total reload of the page. This also does not happen in Firefox.

    I would appreciate it if someone could check on this anomaly. If it is indeed a bug, I will place a ticket for it. Thanks.

Viewing 10 replies - 1 through 10 (of 10 total)
  • Avatar of Boone Gorges
    Boone Gorges
    Keymaster

    @boonebgorges

    Wow, that is a very strange issue. Have you tried clearing your browser cache entirely? It’s possible that there is some rogue javascript in your cache (which may be related to BuddyPress or may not) that is causing this bizarre behavior.

    FWIW I can’t reproduce this, with the same setup (except Snow Leopard instead of Lion, but I can’t imagine it’d make a difference.)

    Avatar of Quint
    Quint
    Participant

    @qrahaman

    @boonebgorges, I cleared the browser cache and got the same results. I reset Safari, other than my passwords, and got the same results. My parent theme is bp-default. I changed from my child theme to bp-default and the dropdown behaves properly. I haven’t changed any core files. So, now I’m a bit stuck. My child theme works in Firefox but not Safari (for the dropdown). Could you point me in some direction that I can troubleshoot where this could be happening?

    In my child’s folder, I have the header, footer, and functions php files, the style.css file, an images folder, and an “includes/fonts” folder for the @fontface fonts that style.css loads. I have not edited any of the parent’s files.

    Thanks!

    Avatar of Boone Gorges
    Boone Gorges
    Keymaster

    @boonebgorges

    Hm. I guess if I were you I would start with my child theme’s javascript. Look for something that would activate when a dropdown is changed, possible using the jquery method .change. At the very least, try disabling your child theme’s javascript (just comment it all out for a moment) to verify that that’s where the problem lies.

    As it stands, it appears that this is *not* a BuddyPress problem, but is related to your theme – but more investigation on your part will make this clearer.

    Avatar of Quint
    Quint
    Participant

    @qrahaman

    @boonebgorges, okay Boone, I’ve spent the last 6 hrs 16 minutes on this. I have determined where the issue is occurring but I do not know how to fix it. But first here’s the calibration I eventually got to: I re-installed WordPress and Buddypress (yep, I’m getting faster reinstalling this stuff). ;-) I created a new child theme; that is, a new style.css file and a new functions.php file to enqueue the child’s style.css file. Here’s the code for my functions.php file:

    `<?php

    function bp_dtheme_enqueue_styles() {
    // Bump this when changes are made to bust cache
    $version = ’20110804′;

    // Default CSS
    wp_enqueue_style( ‘bp-default-main’, get_template_directory_uri() . ‘/_inc/css/default.css’, array(), $version );

    wp_enqueue_style( ‘bp-child-style’, get_stylesheet_directory_uri() . ‘/style.css’, array(), $version );

    // Right to left CSS
    if ( is_rtl() )
    wp_enqueue_style( ‘bp-default-main-rtl’, get_template_directory_uri() . ‘/_inc/css/default-rtl.css’, array( ‘bp-default-main’ ), $version );
    }

    add_action( ‘wp_print_styles’, ‘bp_dtheme_enqueue_styles’ );

    ?>`

    Should be no issue there. With the new stylesheet I started adding back my old code starting at the very top. I didn’t have to go very far at all. It failed at the body selector (at the very bottom of this post); specifically, the @font-face font that the stylesheet loaded. I took it out; I replaced it with verdana or helvetica. No issues. I cycled through all of the @font-face fonts and each one produced the error. Note: The @font-face fonts rendered properly on every page but failed when I clicked on a “dropdown-style” field as described in my first post. Do you have any recommendations? Am I supposed to enqueue the fonts just as I had the stylesheet? If so, how would that be done? Thanks!

    Note: I commented out a few declarations in the body selector to help narrow down which declaration could be the issue. And just like Firefox, this works fine in Chrome 13.0.782.220.

    `/*
    Theme Name: My BP Default Child Theme 1
    Theme URI: http://folio.com
    Description: This is my first Buddypress Default Child Theme
    Author: Quint A. Rahaman, Jr.
    Template: bp-default
    Tags: buddypress, two-column, grey, dark
    */

    /* RESET – http://meyerweb.com/eric/tools/css/reset/ | v1.0 | 20080212 */
    /*


    */

    body,html{height:100%;}
    html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;outline:0;font-size:100%;vertical-align:top;background:transparent;margin:0;padding:0;}
    body{line-height:1;}
    ol,ul{list-style:none;}
    blockquote,q{quotes:none;}
    blockquote:before,blockquote:after,q:before,q:after{content:none;}
    :focus{outline:0;}
    del{text-decoration:line-through;}
    table{border-collapse:collapse;border-spacing:0;}

    /* Floating & Alignment */
    .fl{float:left;}
    .fr{float:right;}
    .ac{text-align:center;}
    .ar{text-align:right;}

    /* Clear Floats */
    .col-full:after{content:”.”;display:block;height:0;clear:both;visibility:hidden;}
    .fix{clear:both;height:1px;overflow:hidden;margin:-1px 0 0;}
    html body * span.clear,html body * div.clear,html body * li.clear,html body * dd.clear{background:none;border:0;clear:both;display:block;float:none;font-size:0;list-style:none;overflow:hidden;visibility:hidden;width:0;height:0;margin:0;padding:0;}

    /* Generated by Font Squirrel (http://www.fontsquirrel.com) on September 8, 2011 */

    @font-face {
    font-family: ‘FontSiteSansRoman’;
    src: url(‘includes/fonts/includes/fonts/fontsitesans-roman-webfont.eot’);
    src: url(‘includes/fonts/fontsitesans-roman-webfont.eot?#iefix’) format(‘embedded-opentype’),
    url(‘includes/fonts/fontsitesans-roman-webfont.woff’) format(‘woff’),
    url(‘includes/fonts/fontsitesans-roman-webfont.ttf’) format(‘truetype’),
    url(‘includes/fonts/fontsitesans-roman-webfont.svg#FontSiteSansRoman’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘BergamoStdItalic’;
    src: url(‘includes/fonts/bergamostd-italic-webfont.eot’);
    src: url(‘includes/fonts/bergamostd-italic-webfont.eot?#iefix’) format(‘embedded-opentype’),
    url(‘includes/fonts/bergamostd-italic-webfont.woff’) format(‘woff’),
    url(‘includes/fonts/bergamostd-italic-webfont.ttf’) format(‘truetype’),
    url(‘includes/fonts/bergamostd-italic-webfont.svg#BergamoStdItalic’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘BergamoStdRegular’;
    src: url(‘includes/fonts/bergamostd-regular-webfont.eot’);
    src: url(‘includes/fonts/bergamostd-regular-webfont.eot?#iefix’) format(‘embedded-opentype’),
    url(‘includes/fonts/bergamostd-regular-webfont.woff’) format(‘woff’),
    url(‘includes/fonts/bergamostd-regular-webfont.ttf’) format(‘truetype’),
    url(‘includes/fonts/bergamostd-regular-webfont.svg#BergamoStdRegular’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘FontSiteSansCondensed’;
    src: url(‘includes/fonts/fontsitesans-cond-webfont.eot’);
    src: url(‘includes/fonts/fontsitesans-cond-webfont.eot?#iefix’) format(‘embedded-opentype’),
    url(‘includes/fonts/fontsitesans-cond-webfont.woff’) format(‘woff’),
    url(‘includes/fonts/fontsitesans-cond-webfont.ttf’) format(‘truetype’),
    url(‘includes/fonts/fontsitesans-cond-webfont.svg#FontSiteSansCondensed’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘FontSiteSansUltraLight’;
    src: url(‘includes/fonts/fontsitesans-ultralight-webfont.eot’);
    src: url(‘includes/fonts/fontsitesans-ultralight-webfont.eot?#iefix’) format(‘embedded-opentype’),
    url(‘includes/fonts/fontsitesans-ultralight-webfont.woff’) format(‘woff’),
    url(‘includes/fonts/fontsitesans-ultralight-webfont.ttf’) format(‘truetype’),
    url(‘includes/fonts/fontsitesans-ultralight-webfont.svg#FontSiteSansUltraLight’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘StMarieThin’;
    src: url(‘includes/fonts/stmarie-thin-webfont.eot’);
    src: url(‘includes/fonts/stmarie-thin-webfont.eot?#iefix’) format(‘embedded-opentype’),
    url(‘includes/fonts/stmarie-thin-webfont.woff’) format(‘woff’),
    url(‘includes/fonts/stmarie-thin-webfont.ttf’) format(‘truetype’),
    url(‘includes/fonts/stmarie-thin-webfont.svg#StMarieThin’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘BergamoStdItalic’;
    src: url(‘includes/fonts/bergamostd-italic-webfont.eot’);
    src: url(‘includes/fonts/bergamostd-italic-webfont.eot?#iefix’) format(‘embedded-opentype’),
    url(‘includes/fonts/bergamostd-italic-webfont.woff’) format(‘woff’),
    url(‘includes/fonts/bergamostd-italic-webfont.ttf’) format(‘truetype’),
    url(‘includes/fonts/bergamostd-italic-webfont.svg#BergamoStdItalic’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘BergamoStdItalic’;
    src: url(‘includes/fonts/bergamostd-italic-webfont.eot’);
    src: url(‘includes/fonts/bergamostd-italic-webfont.eot?#iefix’) format(‘embedded-opentype’),
    url(‘includes/fonts/bergamostd-italic-webfont.woff’) format(‘woff’),
    url(‘includes/fonts/bergamostd-italic-webfont.ttf’) format(‘truetype’),
    url(‘includes/fonts/bergamostd-italic-webfont.svg#BergamoStdItalic’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘BergamoStdRegular’;
    src: url(‘includes/fonts/bergamostd-regular-webfont.eot’);
    src: url(‘includes/fonts/bergamostd-regular-webfont.eot?#iefix’) format(‘embedded-opentype’),
    url(‘includes/fonts/bergamostd-regular-webfont.woff’) format(‘woff’),
    url(‘includes/fonts/bergamostd-regular-webfont.ttf’) format(‘truetype’),
    url(‘includes/fonts/bergamostd-regular-webfont.svg#BergamoStdRegular’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘BergamoStdRegular’;
    src: url(‘includes/fonts/bergamostd-regular-webfont.eot’);
    src: url(‘includes/fonts/bergamostd-regular-webfont.eot?#iefix’) format(‘embedded-opentype’),
    url(‘includes/fonts/bergamostd-regular-webfont.woff’) format(‘woff’),
    url(‘includes/fonts/bergamostd-regular-webfont.ttf’) format(‘truetype’),
    url(‘includes/fonts/bergamostd-regular-webfont.svg#BergamoStdRegular’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘FontSiteSansCondensed’;
    src: url(‘includes/fonts/fontsitesans-cond-webfont.eot’);
    src: url(‘includes/fonts/fontsitesans-cond-webfont.eot?#iefix’) format(‘embedded-opentype’),
    url(‘includes/fonts/fontsitesans-cond-webfont.woff’) format(‘woff’),
    url(‘includes/fonts/fontsitesans-cond-webfont.ttf’) format(‘truetype’),
    url(‘includes/fonts/fontsitesans-cond-webfont.svg#FontSiteSansCondensed’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘FontSiteSansCondensed’;
    src: url(‘includes/fonts/fontsitesans-cond-webfont.eot’);
    src: url(‘includes/fonts/fontsitesans-cond-webfont.eot?#iefix’) format(‘embedded-opentype’),
    url(‘includes/fonts/fontsitesans-cond-webfont.woff’) format(‘woff’),
    url(‘includes/fonts/fontsitesans-cond-webfont.ttf’) format(‘truetype’),
    url(‘includes/fonts/fontsitesans-cond-webfont.svg#FontSiteSansCondensed’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘FontSiteSansRoman’;
    src: url(‘includes/fonts/fontsitesans-roman-webfont.eot’);
    src: url(‘includes/fonts/fontsitesans-roman-webfont.eot?#iefix’) format(‘embedded-opentype’),
    url(‘includes/fonts/fontsitesans-roman-webfont.woff’) format(‘woff’),
    url(‘includes/fonts/fontsitesans-roman-webfont.ttf’) format(‘truetype’),
    url(‘includes/fonts/fontsitesans-roman-webfont.svg#FontSiteSansRoman’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘FontSiteSansRoman’;
    src: url(‘includes/fonts/fontsitesans-roman-webfont.eot’);
    src: url(‘includes/fonts/fontsitesans-roman-webfont.eot?#iefix’) format(‘embedded-opentype’),
    url(‘includes/fonts/fontsitesans-roman-webfont.woff’) format(‘woff’),
    url(‘includes/fonts/fontsitesans-roman-webfont.ttf’) format(‘truetype’),
    url(‘includes/fonts/fontsitesans-roman-webfont.svg#FontSiteSansRoman’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘FontSiteSansUltraLight’;
    src: url(‘includes/fonts/fontsitesans-ultralight-webfont.eot’);
    src: url(‘includes/fonts/fontsitesans-ultralight-webfont.eot?#iefix’) format(‘embedded-opentype’),
    url(‘includes/fonts/fontsitesans-ultralight-webfont.woff’) format(‘woff’),
    url(‘includes/fonts/fontsitesans-ultralight-webfont.ttf’) format(‘truetype’),
    url(‘includes/fonts/fontsitesans-ultralight-webfont.svg#FontSiteSansUltraLight’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘FontSiteSansUltraLight’;
    src: url(‘includes/fonts/fontsitesans-ultralight-webfont.eot’);
    src: url(‘includes/fonts/fontsitesans-ultralight-webfont.eot?#iefix’) format(‘embedded-opentype’),
    url(‘includes/fonts/fontsitesans-ultralight-webfont.woff’) format(‘woff’),
    url(‘includes/fonts/fontsitesans-ultralight-webfont.ttf’) format(‘truetype’),
    url(‘includes/fonts/fontsitesans-ultralight-webfont.svg#FontSiteSansUltraLight’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘StMarieThin’;
    src: url(‘includes/fonts/stmarie-thin-webfont.eot’);
    src: url(‘includes/fonts/stmarie-thin-webfont.eot?#iefix’) format(‘embedded-opentype’),
    url(‘includes/fonts/stmarie-thin-webfont.woff’) format(‘woff’),
    url(‘includes/fonts/stmarie-thin-webfont.ttf’) format(‘truetype’),
    url(‘includes/fonts/stmarie-thin-webfont.svg#StMarieThin’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘StMarieThin’;
    src: url(‘includes/fonts/stmarie-thin-webfont.eot’);
    src: url(‘includes/fonts/stmarie-thin-webfont.eot?#iefix’) format(‘embedded-opentype’),
    url(‘includes/fonts/stmarie-thin-webfont.woff’) format(‘woff’),
    url(‘includes/fonts/stmarie-thin-webfont.ttf’) format(‘truetype’),
    url(‘includes/fonts/stmarie-thin-webfont.svg#StMarieThin’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    #sidebar{display:none;}
    div#content .padder{margin-right:0px; border-right-width:0px;}

    body { font-family: ‘FontSiteSansRoman’, helvetica, sans-serif;
    /* font-size: 0.75em;
    line-height: 1.5em;*/
    color: #3e3e3e;
    background: url(“images/bg.png”) repeat fixed 0 0 #f6f0d6;
    /* max-width: none;
    width: 100%;*/
    /* position: relative;*/
    }`

    Avatar of Boone Gorges
    Boone Gorges
    Keymaster

    @boonebgorges

    Wow, this issue is getting weirder.

    I have copied your theme but I can’t reproduce the problem. This could have to do with the fact that I don’t have the font files on my system. In any case, I have no idea whatsoever about how a font declaration could cause the sorts of problems you’re talking about.

    Just to see if it helps, you might try commenting out the BP javascript that makes the dropdown filters work. Look in buddypress/bp-themes/bp-default/_inc/global.js, around line 542, for the block beginning “When the filter select box is changed re-query”. Comment that out, clear your cache, and try again. (I’m skeptical this will actually get us any closer to the issue, since it sounded like you were having this problem with dropdowns other than this one.)

    Avatar of Quint
    Quint
    Participant

    @qrahaman

    @boonegorges, thanks. I commented out that block. No change. I went back to Font Squirrel and instead of uploading my fonts to their font generator, I just downloaded one of their free kits: Calligraffiti. I then commented out all of the old @face-fonts, added in this new one to my style.css, went through the same routine, and got the same result. This is strange. Could you try with that font or any font kit from Font Squirrel? I assume the Date picker field is in the same genre as a “drop down” field…picking either one results in the total reload of Safari.

    http://www.fontsquirrel.com/fontface

    Avatar of Boone Gorges
    Boone Gorges
    Keymaster

    @boonebgorges

    Thanks for the link. I was able to produce this locally.

    The problem appears to be that Safari does not like @font-face applied to the select element. Here’s what I had to do to make the problem go away:
    `body select, body option {
    font-family: ‘Times New Roman’ !important;
    }`

    You don’t have to use Times, just some system font (*not* @font-face).

    Avatar of Quint
    Quint
    Participant

    @qrahaman

    @boonegorges, you rock! I added the additional css and nervously hovered over that infamous drop down field, crossed my fingers, and clicked on it. It worked! :-) I have to say that was even better than my first bite of a slice of New York pizza!!!!!!! Thank you so much for digging into this!

    Avatar of Boone Gorges
    Boone Gorges
    Keymaster

    @boonebgorges

    Better than NY pizza? I’m dubious :) But glad it’s working now!

    Avatar of Andreas Karsten
    Andreas Karsten
    Participant

    @sospetto

    Am I ever happy you guys ran into this problem before and could locate it. Exact same issue for me, and changing body select to non-@-font-face fixes that. I have filed a bug report with Apple so they can educate Safari about this one…

Viewing 10 replies - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.