<dom-repeat id="xRepeat" as="x">
<template is="dom-repaet">
<div>
<dom-repeat items="[[x]]" as="y">
<template is="dom-repaet">
<div>
<dom-repeat items="[[y]]" as="z">
<template is="dom-repaet">
<span checked-data-id="{{x*y*z}}" >
{{z}}
</span>
</template>
</dom-repeat>
</div>
</template>
</dom-repeat>
</div>
</template>
</dom-repeat>
"{{xyz}}" is no response in Polymer#2.0.
What can I do to make it work?
? ? ?
?
( # # )
I'm feeling ( < ) ...
Related
I have a main section that uses th:if with the same obj I'm using in my fragment but the fragment is throwing an error based on that obj.
Below, the nameInfo in mainInfo fragment is throwing an error. Even with null check.
// main.html
<section th:if="${nameInfo != null AND nameInfo.firstName != null}">
<section class="main-cont">
<div id="name-method>
<div class="main-lg-3">
<div th:replace="component/mainInfo :: mainInfo_check "></div>
</div>
</div>
</section>
</section>
// mainInfo.html
<div th:fragment="mainInfo">
<form>
<section th:if="${nameInfo != null AND nameInfo.firstName != null}">
<div class="radio_btn">
<input type="radio" tabindex="0" onchange="test(0, val)" />
<label for="test-rb" style="outline: none;">
<span class="radio"></span>
<span>Name</span>
</label>
</div>
</section>
</form>
</div>
Try to change this
<div th:replace="component/mainInfo :: mainInfo_check "></div>
To this
<div th:replace="component/mainInfo :: mainInfo"></div>
I am developing an application with IONIC 4 for android and IOS.
I add a side menu (ion-menu), it works perfectly on android.
But in IOS it is giving me problems, the menu opens perfectly. But when I want to close the menu. Graphically the menu closes, but when I try to interact with the application, only the options within the side menu are activated.
Only the side menu items are useful, the rest of the application is canceled.
This is the process.
Main page normally:
I open the side menu:
I close the menu:
All this options gets blocked:
But this options still are activated, even though the menu has been hidden.
This only happen in IOS, my specifications:
My code:
<ion-menu side="start" content-id="main-content">
<ion-header class="headermenu">
<div class="spacioemenuleft">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:center;">
<img alt="logo" style="width:18.9vw; height:10.6vh; border-radius: 50%;" src="{{pictureusuariomenu}}" >
</div> </div> </div>
</div>
<div class="spacioemenuright">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div class="textsaldo2" [innerHTML]="fullname"></div>
<div class="bloque">
<div style="float:left; width:70%; height:100%" class="textsaldo2">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:center;">
PIN: {{pinusuario}}
</div> </div> </div>
</div>
<div style="float:right; width:30%; height:100%; background-color:white;" (click)="copyText()">
<img alt="logo" style="width:100%; height:100%" src="assets/imgs/compartir-b.png" >
</div>
</div>
<span class="error ion-padding" style="color:white; font-weight:bold; margin-top:1em; padding-top:0em;" *ngIf="registrado">
PIN COPIADO!!!
</span>
</div>
</div>
</div>
</ion-header>
<ion-content >
<div class="ion-padding">
<div class="espacio2 margenboton" routerLink="/recargarsaldo">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:center;">
Recargar Saldo
</div> </div> </div>
</div>
<ion-list>
<ion-item>
<div style="float:left; width:20%; height:100%; padding:0.8em;" routerLink="/profile">
<img alt="logo" style="width:2.7vh; height:2.7vh;" src="assets/imgs/perfil.png" >
</div>
<div style="float:left; width:80%; height:100%;" class="textblue2" routerLink="/profile">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:left;">
Mi perfil
</div> </div> </div>
</div>
</ion-item>
<ion-item>
<div style="float:left; width:20%; height:100%; padding:0.8em;" routerLink="/notificaciones">
<img alt="logo" style="width:2.7vh; height:2.7vh;" src="assets/imgs/11notificaciones.png" >
</div>
<div style="float:left; width:80%; height:100%;" class="textblue2" routerLink="/notificaciones">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:left;">
Notificaciones
</div> </div> </div>
</div>
</ion-item>
<ion-item>
<div style="float:left; width:20%; height:100%;padding:0.8em;" routerLink="/misretiros" >
<img alt="logo" style="width:2.7vh; height:2.7vh;" src="assets/imgs/6dolares.png" >
</div>
<div style="float:left; width:80%; height:100%;" class="textblue2" routerLink="/misretiros">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:left;">
Mis retiros
</div> </div> </div>
</div>
</ion-item>
<ion-item>
<div style="float:left; width:20%; height:100%; padding:0.8em;" routerLink="/historial">
<img alt="logo" style="width:2.7vh; height:2.7vh;" src="assets/imgs/11historial.png" >
</div>
<div style="float:left; width:80%; height:100%;" class="textblue2" routerLink="/historial">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:left;">
Historial
</div> </div> </div>
</div>
</ion-item>
<ion-item>
<div style="float:left; width:20%; height:100%; padding:0.8em;" routerLink="/contacto">
<img alt="logo" style="width:2.7vh; height:2.7vh;" src="assets/imgs/contact5.png" >
</div>
<div style="float:left; width:80%; height:100%;" class="textblue2" routerLink="/contacto">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:left;">
Contáctanos
</div> </div> </div>
</div>
</ion-item>
<ion-item>
<div style="float:left; width:20%; height:100%; padding:0.8em;">
<img alt="logo" style="width:2.7vh; height:2.6vh;" src="assets/imgs/7cerrar.png" >
</div>
<div style="float:left; width:80%; height:100%;" class="textblue2">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:left;" (click)="cerrarsession();" >
Cerrar sesión
</div> </div> </div>
</div>
</ion-item>
</ion-list>
</div>
<div style="height: 15vh; background-color:#F3F3F3; padding:0.2em;">
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:center;" >
<div style="float:left; width:40%; height:100%;" >
<div style="display:table;width:100%;height:100%;">
<div style="display:table-cell;vertical-align:middle;">
<div style="text-align:right;">
<p class="textblue2" style="font-weight:bold;">En alianza con:</p>
</div> </div> </div>
</div>
<div style="float:left; width:60%; height:100%; padding:0.1em; padding-top: 0.6em;" >
<img alt="logo" style="width:80%; height:auto" src="assets/imgs/Grupo517.png" >
</div>
</div> </div> </div>
</div>
</ion-content>
</ion-menu>
Any ideas?
<IonContent>
... other page components
{ authenticated ? <Menu/> : null }
</IonContent>
or what i have done in my example is not even render the router code that contains the menu when the user isn't authenticated
if (!authInfo || !authInfo.initialized) {
return (
<IonApp>
<IonLoading isOpen={true} />
</IonApp>
);
} else {
return (
<IonApp>
<>
{authInfo?.loggedIn === true ? (
<IonReactRouter>
<IonSplitPane contentId="main">
<Menu />
<IonRouterOutlet id="main">
<Route path="/page/:name" component={Page} exact />
<Route path="/tabs" component={TabRootPage} />
<Redirect from="/" to="/tabs" exact />
</IonRouterOutlet>
</IonSplitPane>
</IonReactRouter>
) : (
<IonReactRouter>
<Route
path="/create-account"
component={CreateAccountPage}
exact
/>
<Route path="/login" component={LoginPage} exact />
<Redirect from="/" to="/login" exact />
</IonReactRouter>
)}
</>
</IonApp>
);
}
See full app and source code here : https://github.com/aaronksaunders/ionic-sidemenu-tabs-auth-starter
I am trying to use Fine-Uploader in a asp.net mvc core project, but nothing is being displayed, besides a box, In the inspector in google chrome , I am getting qq is not defined.
I am adding the js,css in _Layout.cshtml
CSS
<environment names="Development">
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />
<link rel="stylesheet" href="~/css/site.css" />
<link rel="stylesheet" href="~/lib/azure.fine-uploader/fine-uploader- gallery.min.css" />
<link rel="import" href="~/lib/azure.fine-uploader/templates/gallery.html" />
</environment>
<environment names="Staging,Production">
<link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.6/css/bootstrap.min.css"
asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css"
asp-fallback-test-class="sr-only" asp-fallback-test-property="position" asp-fallback-test-value="absolute" />
<link rel="stylesheet" href="~/css/site.min.css" asp-append-version="true" />
<link rel="stylesheet" href="~/lib/azure.fine-uploader/fine-uploader-gallery.min.css" />
<link rel="import" href="~/lib/azure.fine-uploader/templates/gallery.html" />
</environment>
JS
<environment names="Development">
<script src="~/lib/jquery/dist/jquery.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.js"></script>
<script src="~/js/site.js" asp-append-version="true"></script>
<script src="~/lib/azure.fine-uploader/azure.fine-uploader.min.js"> </script>
</environment>
<environment names="Staging,Production">
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-2.2.0.min.js"
asp-fallback-src="~/lib/jquery/dist/jquery.min.js"
asp-fallback-test="window.jQuery">
</script>
<script src="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.6/bootstrap.min.js"
asp-fallback-src="~/lib/bootstrap/dist/js/bootstrap.min.js"
asp-fallback-test="window.jQuery && window.jQuery.fn && window.jQuery.fn.modal">
</script>
<script src="~/js/site.min.js" asp-append-version="true"></script>
<script src="~/lib/azure.fine-uploader/azure.fine-uploader.min.js"></script>
</environment>
I have the gallery added in a cshtml as per the example on the fine-uploader site, if I remove the first script tag I get the fine-uploader box showing(See image below), but nothing else is shown.
<script type="text/template" id="qq-template">
<div class="qq-uploader-selector qq-uploader qq-gallery" qq-drop-area-text="Drop files here">
<div class="qq-total-progress-bar-container-selector qq-total-progress-bar-container">
<div role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" class="qq-total-progress-bar-selector qq-progress-bar qq-total-progress-bar"></div>
</div>
<div class="qq-upload-drop-area-selector qq-upload-drop-area" qq-hide-dropzone>
<span class="qq-upload-drop-area-text-selector"></span>
</div>
<div class="qq-upload-button-selector qq-upload-button">
<div>Upload a file</div>
</div>
<span class="qq-drop-processing-selector qq-drop-processing">
<span>Processing dropped files...</span>
<span class="qq-drop-processing-spinner-selector qq-drop-processing-spinner"></span>
</span>
<ul class="qq-upload-list-selector qq-upload-list" role="region" aria-live="polite" aria-relevant="additions removals">
<li>
<span role="status" class="qq-upload-status-text-selector qq-upload-status-text"></span>
<div class="qq-progress-bar-container-selector qq-progress-bar-container">
<div role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" class="qq-progress-bar-selector qq-progress-bar"></div>
</div>
<span class="qq-upload-spinner-selector qq-upload-spinner"></span>
<div class="qq-thumbnail-wrapper">
<img class="qq-thumbnail-selector" qq-max-size="120" qq-server-scale>
</div>
<button type="button" class="qq-upload-cancel-selector qq-upload-cancel">X</button>
<button type="button" class="qq-upload-retry-selector qq-upload-retry">
<span class="qq-btn qq-retry-icon" aria-label="Retry"></span>
Retry
</button>
<div class="qq-file-info">
<div class="qq-file-name">
<span class="qq-upload-file-selector qq-upload-file"></span>
<span class="qq-edit-filename-icon-selector qq-btn qq-edit-filename-icon" aria-label="Edit filename"></span>
</div>
<input class="qq-edit-filename-selector qq-edit-filename" tabindex="0" type="text">
<span class="qq-upload-size-selector qq-upload-size"></span>
<button type="button" class="qq-btn qq-upload-delete-selector qq-upload-delete">
<span class="qq-btn qq-delete-icon" aria-label="Delete"></span>
</button>
<button type="button" class="qq-btn qq-upload-pause-selector qq-upload-pause">
<span class="qq-btn qq-pause-icon" aria-label="Pause"></span>
</button>
<button type="button" class="qq-btn qq-upload-continue-selector qq-upload-continue">
<span class="qq-btn qq-continue-icon" aria-label="Continue"></span>
</button>
</div>
</li>
</ul>
<dialog class="qq-alert-dialog-selector">
<div class="qq-dialog-message-selector"></div>
<div class="qq-dialog-buttons">
<button type="button" class="qq-cancel-button-selector">Close</button>
</div>
</dialog>
<dialog class="qq-confirm-dialog-selector">
<div class="qq-dialog-message-selector"></div>
<div class="qq-dialog-buttons">
<button type="button" class="qq-cancel-button-selector">No</button>
<button type="button" class="qq-ok-button-selector">Yes</button>
</div>
</dialog>
<dialog class="qq-prompt-dialog-selector">
<div class="qq-dialog-message-selector"></div>
<input type="text">
<div class="qq-dialog-buttons">
<button type="button" class="qq-cancel-button-selector">Cancel</button>
<button type="button" class="qq-ok-button-selector">Ok</button>
</div>
</dialog>
</div>
<title>Fine Uploader Gallery UI</title>
<div id="uploader"></div>
<script>
var uploader = new qq.azure.FineUploader({
element: getElementById("uploader")
})
</script>
qq is not defined.
This indicates that you are not loading the fine uploader js file correctly onto your page. I suggest looking at your network requests. You will likely see that either the js file isn't loading at all, or the contents are incorrect.
I was missing a #section Scripts surrounding my script tag
<title>Fine Uploader Gallery UI</title>
<div id="uploader"></div>
#section Scripts{
<script type="text/javascript" src="~/lib/azure.fine-uploader/dist/azure.fine-uploader.min.js"></script>
<script type="text/template" id="qq-template">
<div class="qq-uploader-selector qq-uploader qq-gallery" qq-drop-area-text="Drop files here">
<div class="qq-total-progress-bar-container-selector qq-total-progress-bar-container">
<div role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" class="qq-total-progress-bar-selector qq-progress-bar qq-total-progress-bar"></div>
</div>
<div class="qq-upload-drop-area-selector qq-upload-drop-area" qq-hide-dropzone>
<span class="qq-upload-drop-area-text-selector"></span>
</div>
<div class="qq-upload-button-selector qq-upload-button">
<div>Upload a file</div>
</div>
<span class="qq-drop-processing-selector qq-drop-processing">
<span>Processing dropped files...</span>
<span class="qq-drop-processing-spinner-selector qq-drop-processing-spinner"></span>
</span>
<ul class="qq-upload-list-selector qq-upload-list" role="region" aria-live="polite" aria-relevant="additions removals">
<li>
<span role="status" class="qq-upload-status-text-selector qq-upload-status-text"></span>
<div class="qq-progress-bar-container-selector qq-progress-bar-container">
<div role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" class="qq-progress-bar-selector qq-progress-bar"></div>
</div>
<span class="qq-upload-spinner-selector qq-upload-spinner"></span>
<div class="qq-thumbnail-wrapper">
<img class="qq-thumbnail-selector" qq-max-size="120" qq-server-scale>
</div>
<button type="button" class="qq-upload-cancel-selector qq-upload-cancel">X</button>
<button type="button" class="qq-upload-retry-selector qq-upload-retry">
<span class="qq-btn qq-retry-icon" aria-label="Retry"></span>
Retry
</button>
<div class="qq-file-info">
<div class="qq-file-name">
<span class="qq-upload-file-selector qq-upload-file"></span>
<span class="qq-edit-filename-icon-selector qq-btn qq-edit-filename-icon" aria-label="Edit filename"></span>
</div>
<input class="qq-edit-filename-selector qq-edit-filename" tabindex="0" type="text">
<span class="qq-upload-size-selector qq-upload-size"></span>
<button type="button" class="qq-btn qq-upload-delete-selector qq-upload-delete">
<span class="qq-btn qq-delete-icon" aria-label="Delete"></span>
</button>
<button type="button" class="qq-btn qq-upload-pause-selector qq-upload-pause">
<span class="qq-btn qq-pause-icon" aria-label="Pause"></span>
</button>
<button type="button" class="qq-btn qq-upload-continue-selector qq-upload-continue">
<span class="qq-btn qq-continue-icon" aria-label="Continue"></span>
</button>
</div>
</li>
</ul>
<dialog class="qq-alert-dialog-selector">
<div class="qq-dialog-message-selector"></div>
<div class="qq-dialog-buttons">
<button type="button" class="qq-cancel-button-selector">Close</button>
</div>
</dialog>
<dialog class="qq-confirm-dialog-selector">
<div class="qq-dialog-message-selector"></div>
<div class="qq-dialog-buttons">
<button type="button" class="qq-cancel-button-selector">No</button>
<button type="button" class="qq-ok-button-selector">Yes</button>
</div>
</dialog>
<dialog class="qq-prompt-dialog-selector">
<div class="qq-dialog-message-selector"></div>
<input type="text">
<div class="qq-dialog-buttons">
<button type="button" class="qq-cancel-button-selector">Cancel</button>
<button type="button" class="qq-ok-button-selector">Ok</button>
</div>
</dialog>
</div>
</script>
<script>
var uploader = new qq.azure.FineUploader({
debug: true,
element: document.getElementById("uploader"),
template: 'qq-template'
})
</script>
}
This is the video of the bug http://youtu.be/siOfUluPraA
and below is my code.
It seems that
ng-show=true for a split second
signinForm.$submitted = true for a split second
Login.html
<ion-view>
<ion-content ng-controller="SignInCtrl">
<div class="login-logo">
<div><h4>LOGIN TO YOUR ACCOUNT</h4></div>
</div>
<form name="signinForm" novalidate>
<div class="list login">
<!-- input username -->
<label class="item item-input item-top"
ng-class="{'form-has-error' : signinForm.username.$invalid && signinForm.username.$submitted}">
<img src="./img/profile6.png" class= "image-thumb" alt="">
<input type="text"
name="username"
ng-model="user.username"
ng-minlength="5"
required placeholder="Name or National Id">
</label>
<!-- validation username -->
<div class="form-errors"
ng-show="signinForm.username.$error && signinForm.$submitted"
ng-messages="signinForm.username.$error"
ng-messages-include="templates/formerrors/form-errors-username.html">
</div>
</div>
</form>
</ion-content>
</ion-view>
form-errors-username.html
<div class="form-error" ng-message="required">This field is required.</div>
<div class="form-error" ng-message="minlength">This field is must be at least 5 characters.</div>
config.js
app.config(function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('signin', {
url: '/sign-in',
templateUrl: 'templates/login.html',
controller: 'SignInCtrl'
});
$urlRouterProvider.otherwise('/sign-in');
});
What is the best practice?
Thanks in advance!
***** UPDATE *****
I used ng-if="signinForm.$submitted"
instead of ng-show.
Your HTML template is briefly displayed by the browser in its raw (uncompiled) form, while your application is loading.
You can try to use ngCloack to avoid the flicker effect.
<div ng-show="form.$submitted" ng-cloak>
Here's how I fixed it, I used
ng-if="signinForm.$submitted"
instead of ng-show.
I am using Delphi XE2 + TWebbrowser,the web page source code like below:
<html>
<head>
<title>
</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
var loaded = 0;function ScriptLoaded() { ++loaded; if(loaded == 2) ARSystemInit(); }
var ReportSelForm="ReportSelection", RelContextPath='../../../../',AbsContextPath=null;</script>
<link rel="stylesheet" href="../../../../resources/stylesheets/7.1.00 Patch 009 201002230034/ARSystem.css">
<link rel="stylesheet" href="../../../../resources/stylesheets/7.1.00 Patch 009 201002230034/ARSystem_zh.css">
<script type="text/javascript" src="../../../../resources/javascript/7.1.00 Patch 009 201002230034/LocalizedMessages_zh_CN.js" defer></script>
<script type="text/javascript" src="../../../../resources/javascript/7.1.00 Patch 009 201002230034/locale/zh_CN.js" defer></script>
<script type="text/javascript">function DVFsf(){return "\x3cHTML\x3e\x3c/HTML\x3e";} function DVFol(){}</script>
<script type="text/javascript" src="../../../../resources/javascript/7.1.00 Patch 009 201002230034/ClientCore.js" defer></script>
<script type="text/javascript" src="form.js/f7a68ba8.js" defer></script>
<script type="text/javascript">document.write('\x3cscript src="userdata.js?winname=ar05UltraProcess%3AITIL_Incident'+encodeURIComponent(name)+'" defer\x3e\x3c/'+'script\x3e');</script>
</head>
<body onload="ScriptLoaded()" draghandler="BodyDrag" style="display:none">
<div id="Toolbar"><div class="TBTopBarStatus">当前模式： <span class="TBTopBarStatusMode"></span></div><a class="btn TBTopBarBox" href="javascript:"><img class="tbright" src="../../../../resources/images/tb_right.gif" alt="显示工具栏" /><img class="tbdown" src="../../../../resources/images/tb_down.gif" alt="隐藏工具栏" /></a><table cellpadding=0 cellspacing=0 class="Toolbar"><tbody><tr><td nowrap class="TBGroup TBGroup0">
<a class="searchsavechanges btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBsearchsavechanges">搜索</div>
</a>
</td>
<td nowrap class="TBGroup TBGroup1">
<a class="newsearch btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBnewsearch"><img src="../../../../resources/images/tb_search.gif" alt="新搜索" /> 新搜索</div>
</a>
<a class="newrequest btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBnewrequest"><img src="../../../../resources/images/tb_request.gif" alt="新请求" /> 新请求</div>
</a>
<a class="modifyall btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBmodifyall"><img src="../../../../resources/images/tb_modall.gif" alt="全部修改" /> 全部修改</div>
</a>
</td>
<td nowrap class="TBGroup TBGroup2">
<a class="savedsearches btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBsavedsearches"> 多项搜索</div>
</a>
<a class="advancedsearch btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBadvancedsearch">高级搜索</div>
</a>
<a class="clear btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBclear">清除</div>
</a>
<a class="settodefaults btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBsettodefaults">设置为默认值</div>
</a>
<a class="statushistory btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBstatushistory">状态历史记录</div>
</a>
</td>
<td nowrap class="TBGroup TBGroup3">
<a class="logout btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBlogout">注销</div>
</a>
<a class="help btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBhelp">帮助</div>
</a>
<a class="home btn btn3d tbbtn" href="javascript:" style="position:static">
<div id="TBhome">主页</div>
</a>
</td>
</tr>
</tbody>
</table>
</div>
<div id="ResultsList">
<div arid=1020 artype="Table" ardbn="CustomResultsList" class="arfid1020 ardbnCustomResultsList" style="top:0; left:0; width:0; height:0;visibility:hidden;z-index:0;" arcols="2147483647" arcolws="1575" arcoldlen="254" ardrill=1 arserver="#" arschema="#" armaxrows=0 ardtype=1 arcsize=0 arfixhdr=1 arselrows=0 arselinit=0 arselrefresh=0 arautofit=0 arsort="" arqual="{qual:"", ids:[],extids:[]}"><img src="../../../../resources/images/menu_down.gif" alt="" class="TableSortImgUp" arindom=1 /><img src="../../../../resources/images/menu_up.gif" alt="" class="TableSortImgDown" arindom=1 /><div class='TableHdr'><table class='TableHdr' cellpadding=0 cellspacing=0><tbody><tr><td nowrap valign=middle class='TableHdrL'></td><td nowrap valign=middle class='TableHdrR'></td></tr></tbody></table></div><div class='TableInner'></div><div class='TableFtr'><table class='TableFtr' cellpadding=0 cellspacing=0><tbody><tr><td nowrap valign=middle class='TableFtrL'></td><td nowrap valign=middle class='TableFtrR'></td></tr></tbody></table></div></div>
</div>
<div id="Splitter" draggable=1 dragoriginal=1>
</div>
<div id="FormContainer" arcs=1 style="background-color:">
<div style="top:0;left:0;width:1173;height:869"> </div>
<div arid=700000002 artype="Char" ardbn="BaseName" class="df dfro arfid700000002 ardbnBaseName" style="z-index:994;top:2; left:9; width:100; height:25;">
<span style="top:0; left:0; width:100; height:0;"><label class="label f9" for="x-arid700000002" style="width:100px;left:0px;bottom:25px;color:;text-align:center;"></label></span><textarea class="text sr f2 dat" wrap="off" id="arid700000002" cols="20" maxlen=254 style="top:0; left:0; width:100; height:25;" readonly rows=1></textarea>
</div>
<a href="javascript:" arid=700040001 artype="Control" ardbn="Btn_Chart" class="btn btnurl arfid700040001 ardbnBtn_Chart" style="top:5; left:842; width:54; height:20;visibility:hidden;z-index:998;background-color:transparent;"><div class="btntextdiv" style="top:0; left:0; width:54; height:20;"><div class="f7" style=";width:54">流 程 图</div>
</div>
</a>
<a href="javascript:" arid=809041101 artype="Control" ardbn="Btn_AddDate" class="btn btnurl arfid809041101 ardbnBtn_AddDate" style="top:5; left:916; width:65; height:20;visibility:hidden;z-index:1004;background-color:transparent;"><div class="btntextdiv" style="top:0; left:0; width:65; height:20;"><div class="f7" style=";width:65">补充资料</div>
</div>
</a>
<a href="javascript:" arid=700040078 artype="Control" ardbn="Btn_Shengchengzhishi" class="btn btnurl arfid700040078 ardbnBtn_Shengchengzhishi" style="top:31; left:841; width:65; height:20;visibility:hidden;z-index:1003;background-color:transparent;"><div class="btntextdiv" style="top:0; left:0; width:65; height:20;"><div class="f7" style=";width:65">生 成 知 识</div>
</div>
</a>
**<a href="javascript:" arid=700040002 artype="Control" ardbn="Btn_Edit" class="btn btn3d btnd arfid700040002 ardbnBtn_Edit" style="top:32; left:916; width:65; height:20;visibility:hidden;z-index:999;"><div class="btntextdiv" style="top:0; left:0; width:65; height:20;"><div class="f1" style=";width:65">处 理</div>
</div>
</a>**
<div arid=700000003 artype="Char" ardbn="BaseSN" class="df dfro arfid700000003 ardbnBaseSN" style="z-index:995;top:7; left:592; width:198; height:20;">
<label class="label f6" for="x-arid700000003" style="top:4; left:0; width:51; height:16;">流水号：</label><textarea class="text sr dat" wrap="off" id="arid700000003" cols="20" maxlen=254 style="top:0; left:52; width:146; height:20;" readonly rows=1></textarea>
</div>
<div arid=700000004 artype="Char" ardbn="BaseCreatorFullName" class="df dfro arfid700000004 ardbnBaseCreatorFullName" style="z-index:996;top:7; left:252; width:122; height:20;">
<label class="label f6" for="x-arid700000004" style="top:4; left:0; width:60; height:16;">建单人名：</label><textarea class="text sr dat" wrap="off" id="arid700000004" cols="20" maxlen=254 style="top:0; left:61; width:61; height:20;" readonly rows=1></textarea>
</div>
<div arid=806000100 artype="Char" ardbn="Status" ardcf=1 class="df dfro arfid806000100 ardbnStatus" style="z-index:1002;top:7; left:110; width:134; height:20;">
<label class="label f6" for="x-arid806000100" style="top:4; left:0; width:38; height:16;color:;">状态：</label><textarea class="text sr dat" wrap="off" id="arid806000100" cols="20" maxlen=254 style="top:0; left:39; width:95; height:20;" readonly rows=1></textarea>
</div>
<div arid=700000006 artype="Time" ardbn="BaseCreateDate" class="df dfro arfid700000006 ardbnBaseCreateDate" style="z-index:997;top:7; left:386; width:194; height:20;">
<label class="label f6" for="arid700000006" style="top:4; left:0; width:60; height:16;">登记时间：</label><input id="arid700000006" class="text dat" type="text" style="top:0; left:61; width:133; height:20;" readonly ds=0 />
</div>
<div arid=700030001 artype="PageHolder" armaxh=22 class="PageHolder arfid700030001 ardbnPag_Main" style="top:52; left:12; width:973; height:419;background-color:white;z-index:1000;">
<div class="TabChildMissingBorder" style="visibility:hidden;top:22;width:973">
</div>
<div style="visibility:hidden;height:22;width:973" class="OuterTabsDiv">
<div class="ScrollingTab" style="position:relative;float:left;">
<span class="TabLeftRounded"> </span>
<span class="Tab"><<
</span>
<span class="TabRightRounded"> </span>
</div>
<div class="TabsViewPort" style="position:relative;overflow:hidden;float:left;width:5000;height:22">
<div style="overflow:visible;float:left;width:5000;top:0;left:0">
<dl class="OuterOuterTab">
<dd class="OuterTab" artabid=700030002><span class="TabLeftRounded"> </span>
<span class="Tab">基 本
</span>
<span class="TabRight"> </span>
</dd>
<dd class="OuterTab" artabid=806842007><span class="TabLeft"> </span>
<span class="Tab">事件信息
</span>
<span class="TabRight"> </span>
</dd>
<dd class="OuterTab" artabid=700030094><span class="TabLeft"> </span>
<span class="Tab">流程记录
</span>
<span class="TabRightRounded"> </span>
</dd>
</dl>
</div>
</div>
Look page source BOLD part , it is a BUTTON on the web page(arid=700040002 artype="Control" ardbn="Btn_Edit" ) . When this page is full loaded , i want to push the BUTTON in delphi .
This should do it:
procedure ClickElementByContent(Document : IDispatch; TagFilter : WideString; Content: WideString);
var Doc : IHTMLDocument3;
El : IHTMLElement;
Elements : IHTMLElementCollection;
Index : Integer;
begin
Doc := Document as IHTMLDocument3;
if Assigned(Doc) then
begin
Elements := Doc.getElementsByTagName(TagFilter);
for Index := 0 to Pred(Elements.length) do
begin
El := Elements.item(EmptyParam, Index) as IHTMLElement;
if ContainsText(El.innerText, Content) then
begin
El.Click;
Break;
end;
end;
end;
end;
how to use:
procedure clickthebutton;
begin
ClickElementByContent(Webbrowser1.Document, 'DIV', 'DEAL');
end;
procedure TTrackITOrderForm.Btn_DealClick(Sender: TObject);
var
Document : IHTMLDocument2 ;
ButtonDiv , temp : IHTMLElement ;
ElementCount , I : Integer ;
begin
Document := wb1.Document as IHTMLDocument2 ;
ElementCount := Document.all.length ;
for i := i to ElementCount-1 do
begin
temp := Document.all.item(i,'') as IHTMLElement ;
lst1.Items.Add(temp.id+'-->'+temp.innerText) ;
if (temp.tagName = 'DIV') and (temp.innerText = '处理') then
begin
ShowMessage(temp.innerText);
ButtonDiv := temp ;
Break ;
end;
end;
if ButtonDiv <> nil then
ButtonDiv.click ;
end;