Окно Javascript не открывается, когда скрипт Bootstrap или jqueries находятся на одной странице - PullRequest
0 голосов
/ 24 апреля 2020

У меня есть веб-страница, которую я пытаюсь адаптировать, используя Bootstrap. Это наши таблицы деталей, и в основном это работает, но у меня есть некоторые проблемы с кодом Javascript. Надеюсь, я правильно ввел код ниже на этом сайте. Вот страница, с которой у меня возникают проблемы:

https://www.ironwoodelectronics.com/catalog/Content/Templates/BrowsePartGridResponsive.cfm?StartRow=1&cPart=SG-BGA-6000&PartNumber=sg-bga-6000&pincount=&Pinsearch=false&leadPitch=&Manufacturer=0&Man_IC=0&Functions=0&BODYSIZE=&ARRAYSIZE=

Если вы нажмете кнопку «Войти», чтобы увидеть кнопку «Ценообразование», то должно появиться окно ввести адрес электронной почты и страну. Как только вы сделаете это и нажмете «Отправить», он перезагрузит эту страницу и покажет цену. Но по какой-то причине я не могу открыть окно при нажатии на ссылку. Есть некоторые конфликты с некоторыми Javascript с Bootstrap. Я знаю это, потому что у меня все работало, пока я не добавил несколько сценариев для Bootstrap, например, чтобы выпадающие меню работали с Bootstrap. Это исходная страница, поэтому вы можете увидеть, как она должна работать до добавления любых bootstrap скриптов или jqueries:

https://www.ironwoodelectronics.com/catalog/Content/Templates/BrowsePartGrid.cfm?StartRow=1&cPart=SG-BGA-6000&PartNumber=sg-bga-6000&pincount=&Pinsearch=false&leadPitch=&Manufacturer=0&Man_IC=0&Functions=0&BODYSIZE=&ARRAYSIZE=

Я думал, что смогу просто создайте модальное окно с Bootstrap, но тогда я не был уверен, как перезагрузить страницу, чтобы цена отображалась с Javascript. Вот некоторые из Javascript, которые делают эту работу ниже.

<script type="text/javascript" src="#application.SecureBaseURL#/js/jquery.js"></script>
<script type="text/javascript" src="#application.SecureBaseURL#/js/thickbox.js"></script>
<script type="text/javascript">
    function pricingLogin() {
tb_show('','#application.SecureBaseURL#/catalog/Content/Templates/incPricingLogin.cfm?KeepThis=true&TB_iframe=true&height=200&width=400');
    }

    function reloadPartsGrid() {
         location.reload();
    }
</script>

Вот код для страницы с формой в маленьком окне. Он создан с помощью ColdFusion

<cfparam name="Close_Window" default="false">
<cfparam name="distributorID" default="0">
<cfsetting showdebugoutput="no">

<cfquery name="getDistributor"
  datasource="#application.DataSource#"
  cachedwithin="#CreateTimeSpan(1,0,0,0)#">
    SELECT *
    FROM Distributor
    Order By DisplayID
</cfquery>

<cfoutput>

<script type="text/javascript" src="#application.SecureBaseURL#/js/jquery.js"></script>
<script type="text/javascript">
    closeWindow = function() {
        self.parent.reloadPartsGrid();
        self.parent.tb_remove();
    }

    isValidEmailAddress = function(emailAddress) {
        var pattern = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i);
        return pattern.test(emailAddress);
    }

    validate = function() {
        if($("##distributorID").val() == '0') {
            alert("Please select your country");
            return false;
        }
        if(!isValidEmailAddress($("##email").val())) { 
            alert("Please enter a valid email address");
            return false;
        }

        if(!this.form.Opt_In_Email.checked)
        {
          alert('You must agree to the terms first.');
          return false;
        }

        return true;
    }
</script>

<cfif distributorID GT 0>
    <cfquery name="getUser" datasource="#application.DataSource#">
        SELECT *
        FROM SC_Customers
        WHERE Email = '#Email#'
    </cfquery>

    <cfif getUser.RecordCount>
        <cfquery name="updateUser" datasource="#application.DataSource#">
            UPDATE SC_Customers
            SET DistributorID = '#DistributorID#',
                Opt_In_Email = '#Opt_In_Email#'
            WHERE Email = '#Email#'
        </cfquery>
    <cfelse>
        <cfquery name="updateUser" datasource="#application.DataSource#">
            INSERT INTO SC_Customers
                (Email, DistributorID, Opt_In_Email)
            Values
                ('#Email#', '#DistributorID#', '#Opt_In_Email#')
        </cfquery>
    </cfif>



    <cfset session.distributorID = distributorID>

    <script>
        closeWindow();
    </script>

<cfelse>
    <style>
        body {
            font-family: arial;
        }
    </style>

    <cfset session.distributorID = 0>
    <form onsubmit="return validate()">
    <table align="center">
    <tr>
        <td colspan="100%"><strong>Please complete the form
          below to see pricing.</strong></td>
    </tr>
    <tr><td>&nbsp;</td></tr>
    <tr>
        <td><label for="distributorID">Your Country:</label></td>
        <td>
            <select id="distributorID" name="distributorID">
                <option value="0">Select Country</option>
                <cfloop query="getDistributor">
                    <option value="#ID#">#Country_Name#</option>
                </cfloop>
            </select>
        </td>
    </tr>
    <tr>
        <td><label for="email">Email Address:</label></td>
        <td>
            <input type="Text" id="email" name="email" value="">
        </td>
    </tr>



    <tr>
        <td colspan="100%"><input type="checkbox" value="1"
          name="Opt_In_Email"> <font size="-2">Opt-in to receive
          Ironwood Electronics Communications via E-mail. Please
          read our <a href="https://www.ironwoodelectronics.com/catalog/Content/Drawings/Privacy_Policy.pdf"
            title="Privacy Policy" target="new">Privacy Policy</a>.</font>
        </td>
    </tr>

    <tr><td>&nbsp;</td></tr>

    <tr>
        <td colspan="100%" align="center">
            <input type="Submit" name="Submit" onclick="if(!this.form.Opt_In_Email.checked){alert('You must agree to Opt-in to receive Ironwood Electronics Communications via E-mail first.');return false}"
              value="Submit">
            &nbsp;&nbsp;&nbsp;&nbsp;
            <input type="Button" name="Cancel" value="Cancel"
              onclick="closeWindow();">
        </td>
    </tr>
    </table>    
    </form>
</cfif>

</cfoutput>

. Это кнопка входа в систему для всплывающего окна:

<div><a href="javascript:pricingLogin();" role="button"
  class="btn green_button green_background">Log in to see pricing</a></div>

Как я могу открыть это окно javascript, чтобы пользователь мог войти их информация., страница перезагружается, и цена отображается?

Спасибо за чью-либо помощь.

Энди

1 Ответ

0 голосов
/ 25 апреля 2020

Я наконец-то смог заставить мою кнопку входа работать. Мне нужно было переместить сценарии и Jquery вверх на страницу, чтобы меню bootstrap заработало. Затем далее вниз по странице, где должна быть кнопка входа javascript, чтобы кнопка входа работала. Спасибо всем за помощь!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...