0

javascript(ajax)投票スクリプトを再利用可能な(動的)スクリプトに変換して、何度も使用できるようにする必要があります。

うまく機能するajaxがいくつかありますが、それを再現して、投票が必要な追加の質問ごとに一意の識別子を追加する必要があります[コードの9は、変更する必要のある一意の識別子です]。データベースに質問がいくつあっても、それ自体を再現したり、onclick識別子で再利用したりできるように動的にする必要があります。

<CFOUTPUT QUERY = "GetVotes"> </ CFOUTPUT>タグの間にJavaScriptを入れて、9を投票質問の#GetVoteID#に変更し、質問が再現されるときにスクリプトを動的に再現できるようにしました。 CFOUTPUT。しかし、JavaScriptの#GetVoteID#が原因でスクリプトが機能しなくなり、onclick識別子を使用してスクリプトを再利用できるようにする方法がわからないため、これは機能しませんでした。

多くのサイトで賛成票と反対票の質問があり、質問はデータベース出力を通じて動的に再現されます。そこでajaxを再利用するために何をしていますか?

onclick識別子が進むべき道であることを私は知っているので、投票が必要な10、20、または1000の質問を処理できるように、スクリプトやCFCなどを変換する方法についてのヘルプがあります。

以下は私のコードです(リンク、cfajaxproxy、CFC、およびjavascript)

はい/いいえリンク
<CFOUTPUT QUERY="GetVoteList">
<A HREF="javascript:()" onclick="GetVoteYes9(#GetVoteID#);">Yes</A>
<A HREF="javascript:()" onclick="GetVoteNo9(#GetVoteID#);">No</A>
</CFOUTPUT>

ajaxのスタイル
<STYLE>
GetVoteDescription9{visibility : visible}
</STYLE>

cfajaxproxy
<cfajaxproxy cfc="CFC/GetVoteYes9" jsclassname="YesVote9CFC">
<cfajaxproxy cfc="CFC/GetVoteNo9" jsclassname="NoVote9CFC">

はいVoteCFC

<cfcomponent>
    <cffunction name="NewCount9" access="remote">
        <CFQUERY NAME="YesCount9CK" DATASOURCE="MyDSN">
            SELECT  *
            FROM    GetVote
            WHERE   GetVoteID = <cfqueryparam value="9" cfsqltype="CF_SQL_INTEGER">
        </CFQUERY>
        <CFSET NewCount9=#YesCount9CK.YesCount#+1>
        <CFQUERY NAME="UpdateYesCount" DATASOURCE="MyDSN">
            UPDATE  GetVote
            SET     YesCount = <cfqueryparam value="#NewCount9#" cfsqltype="CF_SQL_INTEGER">
            WHERE   GetVoteID = <cfqueryparam value="9" cfsqltype="CF_SQL_INTEGER">
        </CFQUERY> 
        <cfreturn NewCount9>
    </cffunction>
</cfcomponent>

NoVoteCFC

<cfcomponent>
    <cffunction name="NewCount9" access="remote">  
        <CFQUERY NAME="NoCount9CK" DATASOURCE="MyDSN">  
            SELECT  *  
            FROM    GetVote   
            WHERE   GetVoteID = <cfqueryparam value="9" cfsqltype="CF_SQL_INTEGER">  
        </CFQUERY>  
        <CFSET NewCount9=#NoCount9CK.NoCount#+1>  
        <CFQUERY NAME="UpdateNoCount" DATASOURCE="MyDSN">  
            UPDATE  GetVote  
            SET     NoCount = <cfqueryparam value="#NewCount9#" cfsqltype="CF_SQL_INTEGER">  
            WHERE   GetVoteID = <cfqueryparam value="9" cfsqltype="CF_SQL_INTEGER">  
        </CFQUERY>   
        <cfreturn NewCount9>  
    </cffunction> 
</cfcomponent>

ajaxスクリプト

<SCRIPT TYPE="text/javascript">
    function GetVoteNo9()  
    {   
        var GetVoteNo9 = document.getElementById("GetVoteNo9"); 
        var cfc = new NoCFC9();  
            cfc.setCallbackHandler(getDataResultNo9);  
            cfc.NewCount9(true);  
        var GetVoteDescription9 = document.getElementById("GetVoteDescription9").style.display='none'; 
        var content = document.getElementById('YesResponse9').innerHTML='';
        var content = document.getElementById('NoResponse9').innerHTML='You voted No';
    }  
    function getDataResultNo9(NoResult9)  
    {  
        var content = document.getElementById('NoCount9').innerHTML=NoResult;
    } 

    function GetVoteYes9()  
    {  
        var GetVoteYes9 = document.getElementById("GetVoteYes9"); 
        var cfc = new YesCFC9();  
            cfc.setCallbackHandler(getDataResultYes9);  
            cfc.NewCount9(true);  
        var GetVoteDescription9 = document.getElementById("GetVoteDescription9").style.display='none'; 
        var content = document.getElementById('YesResponse9').innerHTML='You voted Yes';
        var content = document.getElementById('NoResponse9').innerHTML='';
    }  
    function getDataResultYes9(YesResult9)  
    {  
        var content = document.getElementById('YesCount9').innerHTML=YesResult;
    }
</SCRIPT>  
4

1 に答える 1

1

これはテストされていません。基本的に、書いているコードを一般化する必要があります。以下のすべては、このアプローチを反映しています。

Vote.cfc (YesVoteCFC/NoVoteCFC を置き換えます)

<cfcomponent>
    <cffunction name="NewCount" access="remote">
    <cfargument name="getVoteId">
    <cfargument name="vote">
    <cfset var choice = structNew()>
    <cfset choice.count = 0>
    <cfset choice.vote = arguments.vote>
    <cfargument name="vote">
    <CFQUERY NAME="VoteCount" DATASOURCE="MyDSN">
        SELECT  NoCount, YesCount 
        FROM    GetVote
        WHERE   GetVoteID = <cfqueryparam value="#arguments.voteId#" cfsqltype="CF_SQL_INTEGER">
    </CFQUERY>
    <cfif arguments.vote>
        <CFSET choice.count = VoteCount.YesCount + 1>
    <cfelse>
        <CFSET choice.count = VoteCount.NoCount + 1>
    </cfif>

    <CFQUERY NAME="UpdateYesCount" DATASOURCE="MyDSN">
        UPDATE  GetVote
        SET     <cfif arguments.vote>YesCount<cfelse>NoCount> = <cfqueryparam value="#choice.count#" cfsqltype="CF_SQL_INTEGER">
        WHERE   GetVoteID = <cfqueryparam value="#arguments.voteId#" cfsqltype="CF_SQL_INTEGER">
    </CFQUERY> 
    <cfreturn choice>
</cffunction>

cfajaxproxy

<cfajaxproxy cfc="CFC/Vote" jsclassname="VoteCFC">

はい/リンクなし

<CFOUTPUT QUERY="GetVoteList">
<A HREF="javascript:()" onclick="GetVote('#GetVoteID#', 'Yes');">Yes</A>
<A HREF="javascript:()" onclick="GetVote('#GetVoteID#', 'No');">No</A>
</CFOUTPUT>

ajax スクリプト

<SCRIPT TYPE="text/javascript">
    function GetVote(id, vote)  
    {   
        var GetVoteNo9 = document.getElementById("GetVote" + vote + id); 
        var cfc = new VoteCFC();  
            cfc.setCallbackHandler(getDataResult);  
            cfc.NewCount(id, vote);  
        document.getElementById("GetVoteDescription" + id).style.display='none'; 
        document.getElementById('YesResponse' + id).innerHTML= (vote == 'Yes' ? 'You voted Yes' : '');
        document.getElementById('NoResponse' + id).innerHTML= (vote == 'No' ? 'You voted No' : '');
    }  
    function getDataResultNo9(choice)  
    {  
        var content = document.getElementById(choice.vote + 'Count9').innerHTML=choice.count;
    } 

</SCRIPT>
于 2010-10-13T10:47:55.917 に答える